はてなブックマーク

このサイトは webサイトのデザインをいろいろ考えてみようかななどと突発的にでっち上げたサイトです。6つ目のデザインです。ええ。 デザインにはカスケーディングスタイルシート(CSS)を使っています。21世紀の今、テーブルレイアウトでもないでしょうから。ですのでデザイン的にはターゲットとなるwebブラウザは、CSSに対応した新しめのもの、たとえば Mozilla(レンダリングエンジン Gecko を使ったもの。N7も含む)や 、Opera7、Safari などを想定していますが、HTML的には素直なよいHTMLをめざしてますので、まともなWEBブラウザであれば閲覧に支障はないでしょう。デザインが再現できるかはともかく。 デザインノート 今回のデザインは、わたしのCGサイトの 2003年5月からのデザインと同じです。背景の画像は同じだと芸がないので新しく描きました。ここでは脱衣(すっぽんぽん)

要素の親子関係や属性についてはXHTML1.1 要素詳細一覧をご覧ください。 文章を記述するための要素 あ行 アドレス <address> block-level 文書の案内や問い合わせ先を表す。作者名、メールアドレス、更新日などを書くのが一般的。 <address>やまだたろう, めいどさんやとい隊主任 Last updated $Date: 2003/02/15 22:38:03 $ GMT</address> アンカー <a> Anchor inline href属性を使ってリンクの始点、あるいはid属性を使って終点をつくる。 <a href="http://www.w3.org/Consortium/Translation/Japanese">仕様書などの日本語訳リンク集</a> イメージマップ <map> inline イメージマップ(クリッカブルマップ)のリンク先を設定する。

標準で入ってると思われるフォントのリストです。日本語・英語以外の言語用のフォントも混じってます。フォントのキャプチャに加え、CSSでフォント指定をしたリストをつけました。インストールされていればそのフォントで表示されるはずですが、ブラウザによっては指定が効かないフォントもあります。[Bold]は太字での表示です。ページデザインの参考にどうぞ。 Mac OS X 10.3 American Typewriter [Bold] American Typewriter Condensed [Bold] American Typewriter Condensed Light [Bold] American Typewriter Light [Bold] Andale Mono [Bold] Arial [Bold] Arial Black [Bold] Arial Narrow [Bold] Ar

さて、ここでは tableを使ったレイアウトのページをCSSを使ったレイアウトのページに書き改めてみましょう。 テーブル CSS もとのテーブルレイアウトのページですが、中身の分量が少ないこともあって割合シンプルなページですね。段組こそありませんが、テーブルの入れ子や透明画像で隙間を空けるなどのよく使われる技法が入ってます。 ページの構造をみる このページの中身を大まかに分けるとこんな感じです。ここではテーブルの罫線を赤で表示させました。本文とフッタを区切る水平罫線(hr要素)以外はすべてテーブルの中に入っていることがわかります。典型的なテーブルレイアウトですね。 「ヘッダ」はこの場合「見出し」としたほうがいいかもしれません。また「次へ」「戻る」などのナビゲーションはこのページではフッタにしかありません。 では順に見ていきましょう。まず HTML を書き直してあとで CSS で表示を整えま

注:まだ書きかけです。 はじめに インターネットとHTML リンクを張るということ つくるための道具 中身を考える 何を伝えるか 読みやすいページのために サイトの構成 スプラッシュページ 画像 画像の種類と使い分け JPEGツール 解像度と画像サイズ JPEG画像圧縮FAQ その1 ページアイコン トラブルシューティング レイアウト なぜレイアウトは崩れるか テーブルレイアウト CSS tableでの装飾をCSSに置きかえる tableでのレイアウトをCSSに置きかえる その他 カウンタ アクセス解析 Japanese only 裏ページ・隠しページ キリ番って? 付録 CSSなお絵描きさんサイト 同サムネイル版 用語 さくいん XHTML1.1 要素一覧 XHTML1.1 要素詳細一覧 文字実体参照一覧 未整理情報 更新履歴 リー こんにちはー。リーとティムだよ。これからサイトづくりの