HTML文書にCSSを適用する－CSSの基本
■HTML文書にCSSを適用する CSSでHTML文書やXHTML文書にスタイルシートを適用するには、大きく分けて以下の3つの方法があります。 <link>要素で外部CSSファイルを呼び出して適用する <style>要素で文書単位に適用する 要素にstyle属性を追加して局所的に適用する <link>要素で外部CSSファイルを呼び出して適用する スタイルシートを記述したCSSファイルをHTMLファイルとは別に作成して、HTMLファイル内から呼び出します。 呼び出しには、HTML文書の<head>要素内に<link>要素を記述して、外部CSSファイルを指定します。 適用されるスタイルがCSSによるものであることをブラウザなどに知らせるために、<link>要素のtype属性の値にはtext/cssを指定します。 XHTMLとの互換性やスタイルの修正のしやすさなどを考慮すると、この方法でスタイル
ブラウザにソースコードをそのまま表示する基本的な方法
Bloggerでブログを書いているわけですが、ソースコードをそのまま表示する際などはHTMLに直書きした方が思いどうりに出来ていいですよね。その際の基本的な方法の覚書メモです。ソースコードをハイライト表示できるライブラリとして「SyntaxHighlighter」や「google-code-prettify」などがあります。見栄えを考えるとこういったツールを使った方がいいですね。でも、今回は基本中の基本としてソースコードをそのままブラウザに表示する方法についてまとめました。 エスケープ・エンコードしてWEB用に置換変換 HTMLでは「<」や「>」などはタグの記号なので、文字として表示する場合にはそのままでは表示されません。「<」や「>」をはじめとしてHTMLの特殊文字を表示させるためには、「<」は「<」、「>」は「>」と書き換えてタグを無効化（エスケープ）する必要があります
WordPress サイトを静的 HTML に変換するプラグイン StaticPress - dogmap.jp
実は WordPress サイトを静的 HTML に変換するプラグイン StaticPress をリリースしていました。 ダウンロードは、WordPress 公式プラグインディレクトリからお願いします。 WordPress › StaticPress « WordPress Plugins このプラグインを使用することで WordPress で作成されたサイトを丸ごと静的ファイルに変換することができます。 また、変換時にサイトのパーマリンク構造を変換することができるため、http://wp.example.com/ というオリジナルサイトを http://www.example.com/static/ というサイトとして公開するための html を作成することも可能です。 完全に静的ファイルを作成するため、コメントやサイト内検索・コンタクトフォームの設置などはできません。 それらについては
WordPressを静的htmlに出力してローカルに保存する方法
WordPressを使ったサイトを静的サイトにしてまるごとローカルへ保存したい、っていうときは、どんな方法が一番いいのかなと思って調べてみたメモです。 背景 会社で毎年特設サイトを作っておりまして、担当社員でブログも使いたいということで昨年よりWordPressを導入して作ってみました。これがワンシーズンごとに作り直すものでして、担当も変わっていくので、歴代のはどんなだったのかな、っていうのを参考のためにローカルに残しておきたいというものです。 社内に専用のWebサーバをたてられれば楽なのですがそれもちょっと…という感じでして、静的なhtmlで一番ラクに残しておけるのはどうすればと、方法をいろいろ調べてみました。 どうでもいいですが、静的だっつってんのに何度も性的htmlの誤変換に悩まされましたw プラグイン twitterで聞いてみたらほとんどの方が挙げてくださったのがこちらのプラグイン
リンク先のサムネイル画像をHTMLタグで表示しCSSで装飾を設定する方法 - 移転→hapilaki.net
リンク先を画像なしの文章で紹介するよりも、サムネイル画像を一緒に表示した方が直感的に伝えやすい。シンプルなHTMLとCSSで可能。jQueryやJavaScriptは不要。 概要 次の「サムネイル付きリンク」のHTMLとCSSの構造や設定を解説する。このページではthumbnail-boxと呼称する。 持ち物の多さで海外旅行初心者だと分かり、中身を見れば不要品が詰まっている - はぴらき合理化幻想 ↑サンプルのthumbnail-box。 以前に、次のページでchrome拡張機能を紹介した。それに追加したコードの説明も兼ねている。 ブログ記事作成を効率化！サムネイル画像付きのリンクを2クリックで作成 - はぴらき合理化幻想 特長 サムネイルと記事タイトルを１つのaタグでリンク可能。サムネイルと記事タイトルで別々のaタグを使用しているコードが多いが、当ページで紹介するコードの方がシンプル。サ
読者が選択するブログを作ってみる - もふぬこ動画☆画像
昨日投稿した「ねこがあらわれた。どうする？」で、実際に選択できたらもっと良かったかなぁ・・・と思ったので作ってみました。 選択肢（リンク風の何か）をクリックすると結果が表示されます。 みつめる 手を差し出す 仲間になりたそうにこちらを見ている 仲間にしますか？ はい もちろん 仲間にする ねこは逃げ出した！ ねこは仲間になった！ ------------------------------ こんなの簡単だろ？と思いつきで作り始めたのですが、思ったよりも苦戦しました・・・ はてなブログの投稿画面が勝手にHTML書き換えるんだもん・・・。 HTMLやJavaScriptの知識がちょっとあれば簡単にできるのですが、 知識の無い人がみたら「おぉ！？」って思うかも知れません？ （思わないかも知れませんｗ 「ふ～ん。で？」みたいなｗ） とりあえずコード全文です。(はてなブログの仕様により一部書き換えて
サイト上で流れる文字、点滅するアイコン……三菱東京UFJ銀行の注意喚起が“懐かしい” - はてなニュース
怪しいけれど効果は抜群？ 三菱東京UFJ銀行のサイトトップに、同社の名をかたる不審なメールに気を付けるよう注意を促す案内が掲載されました。しかし「重要なお知らせ」の背景を飾る黒と黄のラインや、右から左に流れていく文章などは、普段の同社のサイトとは異なった印象を抱かせます。はてなブックマークには「逆に怪しい！」「文字スクロール懐かしいｗ」などの反応が集まっています。 ▽ http://bk.mufg.jp/ 三菱東京UFJ銀行によると、同社の名をかたってネットバンキングのパスワード変更を促すメールが、不特定多数のユーザーに送信されているとのこと。同社がメールでパスワードなどの入力を依頼することは「絶対にない」として、サイトのトップなどで“偽メール”に記載されたURLをクリックしたり、不審なサイトでパスワードを入力したりしないよう呼び掛けています。 同社は不審なメールに注意するよう促す案内を、
テーブルタグ作成ツール［Web便利ツール］ - TAG index
<table border> <tr> <td>1-1</td> <td>1-2</td> <td>1-3</td> </tr> <tr> <td>2-1</td> <td>2-2</td> <td>2-3</td> </tr> </table> 各設定項目で表の設定を行ってください。設定内容の詳細はテーブルタグカテゴリーでご覧になれます。（このツールでは、セルを個別に指定したりセル同士を結合させることはできません） 列数は1～20、行数は1～100の範囲で指定できます。数値を大きくすると処理に時間がかかる場合があります。 背景色について 表全体の背景色 … 枠線を含めた背景色 セル全体の背景色 … 枠線を含めない背景色 見出しの背景色 … 見出しの列（行）部分のみの背景色 コピーしたものを設定項目に貼り付けた場合、そのままではサンプルの表示に反映されません。その場合は更新するボタンを押し
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML特殊文字変換｜コードをホームページに載せる時に便利 | すぐに使える便利なWEBツール | Tech-Unlimited
作りながら学ぶ HTML/CSSデザインの教科書-公式サポートサイト
Amazon.co.jp: スラスラわかるHTML&CSSのきほん: 狩野祐東: 本
Amazon.co.jp: できるホームページ HTML&CSS入門 Windows 7/Vista/XP対応: 佐藤和人, できる編集部: 本
Amazon.co.jp: 作りながら学ぶ HTML/CSSデザインの教科書: 高橋朋代, 森智佳子: 本