最終更新日:2014/7/24

更新履歴

障害情報


〜 目次 〜

初めに

HTML編

※HTML5のことはHTML5のコーナーで解説しています。ここではHTMLの基本的なことを記載しています。

XHTML関連

※より詳細なDTDにつきましては「文書型定義(DTD)について」をご参照ください。

※スタイルシート編集用テキストファイルはページ最下段にあります。(サイドバーにもあります。)

ひな型

※上記のXHTML1.1 DTD (テキスト形式)が表示されないときは下のHTML形式を利用してください。(ソースをお手元のエディタにコピペしてお使いください。)

IE7の考察

DTD関連

 分散しているDTD(文書型定義)関係を再度、まとめてあります。

検証

 記載ミス、文法ミスを防ぐために

CSS基礎知識

■対象とクラス

外部スタイルシートの作り方(〜実践編〜)

CSSプロパティの解説(〜スタイルの指定〜)

 純粋にCSSの書式のみを記載します。余計なものは一切入れません。

■背景

■通常画像

※一般の領域(ボックス)の左右どちらかにテキストを回り込ませたい場合は、「配置と表示」の「ボックスの左右にテキストを回り込ませる 」をご参照ください。

■フォント(字体、字形)

■テキスト

■領域(ボックス)

■リスト

■テーブル(表)

■配置と表示

■そのほかのプロパティ

HTML5編

■基礎知識

■HTML5文書ひな形

※人によっては、テキスト形式のほうが編集しやすいかも知れませんのでテキスト形式も貼り付けておきます。もし、テキスト形式が表示されないときはHTML形式を利用してください。(名前を付けて保存してください。)

■HTML5チャート

CMS編

ホームページ編

 筆者にとって、ホームページを作るとき、疑問に思ったこと、興味を持ったことを中心に解説しました。

メタタグ・メタ情報

移動・送信

文書情報

アクセシビリティのヒント

 アクセシビリティに配慮した文書作りは、ロボット型検索エンジンに優しいSEO対策としても有効です。

CSSファイルの登録とサイトの概要

外部スタイルシートのサンプルソース

 当サイトのCSSファイルは3枚あります。クラスセレクタ(IDセレクタもありますが・・・)を使えば、たった一枚のCSSファイルでまかなうことも可能です。

※( )内は、当サイトにおける外部スタイルシートとしてのCSSファイル名です。

無料で作るサンプル素材集(JavaScript&CSS)

※XHTML環境におけるJavaScriptの使い方は「XHTML文書におけるJavaScriptの注意点」をご参照ください。

付録(そのほか、何でも・・・)

■コピー&ペースト用テキストファイルの使い方

 クリックして、ブラウザの「ファイル」メニューから「名前を付けて保存」を選択すると内容が整形(改行)された拡張子"txt"のテキストファイルとして保存されます。なお、ブラウザによっては保存したときにソースが整形されていないことがあります。その場合はブラウザで表示された内容をお手元にあるテキストファイルにコピペしてお使いください。

資料・チャート

 DOCTYPE宣言のDTD(文書型定義)の種類、バージョンごとの要素、属性対応状況を掲載してあります。


ページトップに戻る

目次に戻る

更新履歴


ー 後記 ー


最後に

 このサイトはもともと筆者の別のサイトでひとつのコーナーとして解説していたものをサイトとして独立させ、さらに2007年1月にレンタルサーバ環境へ移行させました。当初はスタイルシートを初めて学ぶ方を対象にしていたのですが、2006年3月に「外部スタイルシートの作り方」から現在のタイトルに変更しました。基本中の基本は一通り解説したつもりですが、今後もXHTMLとCSSの解説に力を入れていきたいと思います。サンプルソースの内容につきましては、完璧とは思いませんが、どうぞ参照にしながら、良いXHTML文書とCSSの外部スタイルシートを作ってください。皆さまのWebサイト制作にお役に立てれば幸いです。

 わが国では、2004年6月20日にウェブ・アクセシビリティのJIS規格が制定されました。今後もウェブ・アクセシビリティの実践に、CSS(カスケーディング・スタイルシート)が威力を発揮するのは間違いありません。

ご注意: 内容につきましては随時、修正、加筆あり。また、全体的に内容が増える傾向にあります。そして、サイトのCSSサンプルソースも予告なしに変更になる場合があることをあらかじめ、ご了承ください。

脚注:


ページトップへ戻る