HTML4.01とCSSによるWeb標準のホームページ作成入門。
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
CSS(スタイルシート)についての基礎的な話はスタイルシートの基本やとほほのスタイルシート入門(基礎知識)が参考になります。
さて、上記のサイトを読みましたか？ああそうですか、読みましたか。で、理解できましたか？最初はわかったようなわからないような感じですよね。
初心者が読んで、セレクタ、プロパティだのclassとかidとか言われても、いまいちピンとこないと思います。
また、文字の色を変えるなど、部分的な解説を読んでも、ページ全体をどう装飾するかのイメージはつかみにくいのではないでしょうか。
管理人がCSS(スタイルシート)の勉強を始めたときはそうでした。
CSS(スタイルシート)の説明は実例を見せるのがわかりやすいと思いますので、CSS(スタイルシート)を使ってページ全体を装飾する過程を紹介することで説明をしたいと思います。
そういうホームページ作成の流れをつかんでいただけたらと思います。
CSS(スタイルシート)で装飾といっても、まずはコンテンツがないとどうしようもないので、サンプルの文章を作りました。
→ サンプルテキスト1(txtファイル、文字コードShift_JIS)
(文章はWikipediaのHyperText Markup Language、Cascading Style Sheetsからお借りしました。)
サンプルテキスト1に
hタグ(見出し)、
pタグ(段落)、
ulタグ(順序のないリスト)
でマークアップをしてみたものがこちら。
→ サンプルテキスト2(txtファイル、文字コードShift_JIS)
(dl、dt、ddタグを使うべきとか細かいツッコミは無しでお願いします。あくまでサンプルなんで。)
サンプルテキスト2をホームページの雛型の<body>～</body>に入れて、<head>～</head>部分にいろいろ書き加えたものがこちら。 → サンプルページ1(htmlファイル、文字コードUTF-8N)
このサンプルページにCSS(スタイルシート)使って、見た目をいじっていきます。
リンクはご自由にどうぞ。
最終更新2008/07/09
