Helping you build a solid stylesheet foundation based on your markup Instructions Upload your HTML document CSS template is generated based on the HTML elements used Download CSS File
ブロックレベル要素 ブロックレベル要素とは昔風の解説で言うなら、改行を伴う要素です。 上記の例では青いボーダーの要素です。 HTML4.01 Strictでは次の要素がこれにあたります。 p div table dl ul ol form address blockquote h1 h2 h3 h4 h5 h6 fieldset hr pre ブロックレベル要素の特徴は、親要素の内容幅全体に広がって配置されます(上記の例では黒い二重のボーダーが親要素のボーダーです)。 つまり、ブロックレベル要素の横に他の要素は(通常フローなら)並べることができません。 このような特徴からボーダーが(見えて)ない時の様子から「改行を伴う」と言われています。 CSS2ではブロックレベル要素は矩形(四角形)で表現されると考えると簡単に理解できるかと思います。 インライン要素 ブロックレベル要素に対し、文中の一部
floatを使ったコーディングで気をつけることその2です。 「floatを使ったコーディングは難しい」と最初は思うかもしれませんが、きちんとしたルールに則って使ってあげれば 決して難しいことではないのです。 フルCSSレイアウトをマスターする上でも重要になりますので必ずマスターしてくださいね。 さて、前回はIE6のバグでしたが今回はfloatの解除に関する問題です。 基本的にfloatを使ったら必ずclearで解除すると覚えて下さい。 このエントリでは、<img>要素にfloatを付けて文字を回り込ませるという使い方ではなく、 <div>等のブロックレベル要素をfloatしてレイアウトを組む時の方法になります。 ブロックレベルとインラインレベル まず、「ブロックレベル」と「インラインレベル」ってご存知でしょうか。 htmlタグと呼ばれる要素は2種類に分別することができます。それが上の2つで
テーブルレイアウトからCSSでのレイアウトに切り替える時に最初に覚える要素「float」 今回はその時の注意点と検証と解決法を紹介します。 このカテゴリでは、CSSでのブラウザ間のズレの修正やありがちな間違い、 IE6対策などを紹介します。 テーブルレイアウトからCSSレイアウトへ 第1回は、最初につまづきやすいfloatを使ったレイアウトです。 テーブルレイアウトからいざフルCSSで記述してみたもののIEと他のブラウザの見え方が違う ということで諦めてしまう方も少なからずいると思います。 私も最初にCSSを使ってコーディングをした時苦しんだものです。 では最初にテーブルレイアウトで、背景が灰色で横幅350pxのボックスの中に 50pxの間隔を空けて100pxのボックスを2つ配置します。 以下のようになります。 <table width="350" height="50" bgcolor=
ページ全般 ページの背景色、背景画像、マージン、スクロールバー、印刷 ... ボックス ボックスの背景色、背景画像、マージン、パディング、境界線、配置 ... テキスト・フォント 文字サイズ、文字色、装飾、行間、インデント、文字間隔、改行の扱い ... リンク リンク文字の色、リンクの下線、ポイント時の装飾 ... リスト マーカーの種類、画像のマーカー、リストの余白、間隔、配置 ... イメージ 画像のサイズ、切り抜き、画像に並ぶテキスト、回り込み ... テーブル 表の大きさ、表の背景、境界線、セル内の位置指定、回り込み ... フレーム インラインフレームのサイズ、境界線、フレーム内の指定 ... フォーム 入力欄の大きさ、背景、境界線、文字サイズ、入力モード ... フィルタ 半透明、グラデーション、影付け、発光、波状、反転、サンプル一覧 ...
Account Suspended This Account has been suspended. Contact your hosting provider for more information.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く