■ 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の本を買う必要がなくなり、出版社が困るくらいのものを頑張って作り上げます(笑)
[ → BACK ]