■ Webを自在に操ろう!!

中級者以上のための、htmlとスタイルシートの完全解説&辞典。
極めずして、Webは語れない。
CSSNavigator」でスタイルシートが、「htmlNavigator」でタグが、きっとあなたのものになるでしょう。


CSSNavigator

スタイルシートなしではCoolWebを語れない。
CSSはhtmlと同じように自由に使いこなせないともはや話になりません。応用ではなく基本です
htmlタグではできなかったことや複雑なテーブルタグで応用していたことが簡単にできたり、、

スタイルシートを基本から分かり易く解説するように心がけました
初心者が一から学ぶのにも使えます。上級者が値などを忘れてしまったときの辞典としても使えます
ここさえ見ればスタイルシートの本をわざわざ買う必要はありません。迷ったらいつでもここへどうぞ


スタイルシート(CSS)って何?

・スタイルシートのすすめ
・このサイトにおける記号、記述の意味


スタイルシートの基本、記述方法

・スタイルシートの構造
・スタイルシートの書き方

・CSSファイル
・html内への埋め込み
・インラインでの埋め込み
・優先順位
・CSSからCSSを読み込む


セレクタの使い分け、単位と色

・タグに対してスタイルを設定
・任意の範囲にスタイルを設定
・リンクタグ(A)の特殊セレクタについて

・単位について
・色について


スタイルシートコラム


テキスト

・文字の色を指定(color)
・文字の水平位置を指定(text-align)
・均等割符を行う(text-justify)
・文字を飾る(text-decoration)
・段落にインデントをつける(text-indent)
・文字の水平位置を指定(vertical-align)
・大文字・小文字をコントロールする(text-transform)
・文字間隔を設定する(letter-spacing)
・空白の扱いを設定する(white-space)
・ルビの配置の調整
・ルビをテキストの直後に配置する


ボックス(ボックス各値)

・マージンの設定
・マージンを個別に設定
・ボックスと枠内の文字との間隔を指定
・ボックスと枠内の文字との間隔を個別に指定
・ボックス要素の高さを指定
・ボックス要素の幅を指定
・内容があふれる場合の処理を指定
・内容があふれる場合の横方向への処理を指定
・内容があふれる場合の縦方向への処理を指定


ポジショニング

・要素の配置を指定
・上下の位置を指定
・左右の位置を指定
・重ね合わせの順序の決定
・表示、非表示の指定
・表示形式の変更
・回り込みの指定
・回り込みの解除
・ボックス要素の一部を表示


フォント

・フォントの指定(font-family)
・文字の大きさの指定(font-size)
・文字の太さの指定(font-weight)
・行送りを調整する(line-height)
・文字を斜体にする(font-style)
・スモールキャップ文字を使う
・文字属性を一括して設定する
・システムと同じフォントを使う
・禁則処理を適用する
・単語中の改行処理を指定


背景

・背景の色を指定(background-color)
・背景画像を指定(background-image)
・背景を固定する(background-attachment)
・画像の貼りこむ方法の調整(background-repeat)
・背景画像の位置を決める
・背景属性を一括して設定する


ボックス(枠線)

・ボックスの基本と特徴
・枠線のスタイルを指定(border-style)
・枠線のスタイルを個別に指定(border-top-styleなど)
・枠線の太さを設定(border-width)
・枠線の太さを個別に指定(border-top-widthなど)
・枠線の色を設定(border-color)
・枠線の属性を一括して設定する(border)


フィルター

・半透明のフィルタをかける
・影をつける
・影を伸ばす
・ウェーブをかける
・一部を透過する
・ブレ効果を使う
・浮き出ているように見せる
・方向を反転させる
・色を反転させる
・グレースケールにする
・X線フィルタをかける
・マスクをかける


その他

・リストのマークの指定
・リストのマークに画像を使う
・リストのマークの配置を決める
・リストのマークを一括して設定する

・テーブルの表示を速くする
・内枠線を処理する

・改ページを指定
・スクリプトをページから分離させる
・カーソルの形状を指定
・IMEをコントロールする
・テキストの流れる方向を変える


htmlNavigator

Web作成の第一歩を。主に中級者以上を対象にタグ(html)を細かく解説しています
タグを極めることはCoolWebへの道のりの第一歩です。htmlを早く自分のものにしましょう!!


ページの基本的な設定

・ページの自動的な再ロードや自動ジャンプ(meta refresh)
・漢字コードを指定する(meta content-type)
・相対URLの基本的な場所を指示する(base)
・バックミュージックを流す(bgsound embed)
・背景を固定して文字のみをスクロール(bgproperties)
・上位のフォルダにリンクする("../")
・ロボット型検索エンジンにサイトの情報を与える
・ロボット型検索エンジンを制御する


基本的なタグ

・文章をそのまま表示させる(pre)
・<や>などのタグをそのまま表示させる(xmp)
・文章をスクロールさせる(marquee)
・文字を点滅させる(blink)
・任意の大きさの空白をあける(spacer)
・段組を作る(multicol)
・自動折り返しをさせない(nobr)
・影のない区切り線(noshade)
・引用として少し右寄りで表示させる(blockquote)
・html内にコメントを書く
・< や > や &や空白を表示させる
・メールを起動させる(mailto)
・同一ページ内でリンクを作る(a name)


文字に関するタグ

・ハートやダイヤを表示させる(font face)
・いろいろな文字を表示させる(論理型タグ)
・いろいろな文字を表示させる(物理型タグ)
・前の文字より大きくしたり小さく表示する(big small)
・フォントを指定する(font face)


テーブル、リスト、画像

・テーブルタグ応用編(table)
(表題、背景画像、外枠線、内枠線の指定)

・印付きリスト(ul)
・定義リスト(dt)
・番号付きリスト(ol)

・ダミー画像を使った2段階表示(lowsrc)
・画像読み込み中に文章を表示させる(lowsrc)
・画像の周りに空白をあける(vspace,hspace)
・IMGタグのalign属性一覧(img align)


フォームタグ

・アンケートなどを作る(form)
・フォームの開始と終わり
・テキストを入力する
・項目を選択する
・指定されたデータを送る
・送信・リセット
・ポップアップ・リストからの選択
・複数行のテキスト入力


イメージマップ、フレーム関係

・クリッカブルイメージマップ(map area)
・フレーム解除や新しいウインドウを開く(target)
・フローティングフレーム(iframe)


忘れやすいタグ一覧

・テーブル属性一覧(table)
・フレーム属性一覧(frame)




★ 2006/12/01 - 現在このページは完全リニューアル制作中です。
現時点ではすべての解説を完成できていませんが、
最新のタグやCSSも含め、すべて「完全」に解説しているものを近日オープンさせます!
もうタグやCSSの本を買う必要がなくなり、出版社が困るくらいのものを頑張って作り上げます(笑)