●LESSON⇒ menu ●HTML⇒ 01tag> 02sample ●CSS⇒ 01box> 02font-text> 03background> 04outline> 05table> 06iframe> 07hack> 08sample

01CSS--07css_hack(CSSハック)+css_(詳細)+css_(CSSプロパティ)+css_(CSS3)と機能
№00: all №01:cssハック №02:02cssハック(詳細) №03:ABC順のA、B №04:ABC順のC、D №05:ABC順のE、F №06:ABC順のG、H
№07:ABC順のI、J №08:ABC順のK、L №09:ABC順のM、N №10:ABC順のO、P №11:ABC順のQ、R №12:ABC順のS、T №13:ABC順のU、V
№14:ABC順のW、X №15:ABC順のY、Z №1601css(CSS3)-----------------------

★Lesson⇒ menu ★html_Lesson⇒ 01Spell Lesson> 02sample ★css_Lesson⇒ 01Spell Lesson№1> 02Spell Lesson№2> 03sample

01CSS--07css_(CSSハック)+css_(詳細)+css_(プロパティ)+css_(CSS3)とSpell Lesson


01:マージン(ボックス)
02:マイン-ハイト(ボックス)
03:マイン-ゥイドス(ボックス)
04:マックス-ハイト(ボックス)
05:マックス-ゥイドス(ボックス)
06:アウトライン(フォーム)
07:〃(アウトライン)
08:〃(リンク)
09:〃-カラー(アウトライン)
10:〃-スタイル(アウトライン)
11:〃-ゥイドス(アウトライン)
12:.オウヴぁフロウ(ボックス)
13:パディング(ボックス)
14:パディング(テーブル)
15:ページ-ブレイク-アフタ(印刷)
16:ページ-ブレイク-ビフォー(印刷)
17:ポジション(ボックス)
18:ポジション(リンク)
19:テーブル-レイアウト(テーブル)
20:テキスト-アライン(フォント・テキスト)
BOX1
01:
02:
03:
04:
05:
06:
07:
08:
09:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
BOX2
21:テキスト-ァライン/マージン(罫線)
22:テキスト-ァライン/ヴぁ~ティカル-ァライン(テーブル)
23: テキストデコレーション(フォント・テキスト)
24: 〃(リンク)
25:テキスト-インデント(フォント・テキスト)
26:テキスト-トランスフォーム(フォント・テキスト)
27:ユーニ -コード-ビーディ(フォント・テキスト)
28:ヴぁ~ティカル-ァライン(フォント・テキスト)
29:ヴぁ~ティカル-ァライン(画像)
30:ヴイザビラティ(ボックス)
31:ヴイザビラティ(テーブル)
32:ホワイト-スペース(フォント・テキスト)
33:ホワイト-スペース(テーブル)
34:ゥイドス(ボックス)
35:ゥイドス/ハイト(罫線)
36:ゥイドス/ハイト(テーブル)
37:ゥイドス/ハイト(フレーム)
38:ゥイドス/ハイト(フォーム)
39:ワード-スペイシング(フォント・テキスト)
40:ゼット-インデクス(ボックス)
BOX3
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
BOX4
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
BOX5
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
BOX6

01CSS--07css_(CSSハック)+css_(詳細)+css_(プロパティ)+css_(CSS3)の検索
■ 検索する項目はプロパティ名です。 【 チェック⇒ プロパティ名 】
■ キー・ワードを入力してください。 【 チェック⇒ :含むもの 例:widthを検索する場合
キー・ワード入力「 width 」「 wi 」「 w」 「 h 」などのいずれか入力----------------------- 【 キー・ワード入力⇒  】

01CSS--07css_(CSSハック)+css_(詳細)+css_(プロパティ)+css_(CSS3)の正解率

№01№02№03№04№05№06№07№08№09№10

№11№12№13№14№15№16№17№18№19№20

№21№22№23№24№25№26№27№28№29№30

№31№32№33№34№35№36№37№38№39№40

№41№42№43№44№45№46№47№48№49№50

№51№52№53№54№55№56№57№58№59№60

№01№02№03№04№05№06№07№08№09№10
№11№12№13№14№15№16№17№18№19№20
№21№22№23№24№25№26№27№28№29№30
№31№32№33№34№35№36№37№38№39№40
№41№42№43№44№45№46№47№48№49№50
№51№52№53№54№55№56№57№58№59№60●解答60問中..問  ★正解率0%
項目解説備考

全データ

項目解説備考
1 01cssハック ◆◆◆css_hack(CSSハック)1◆◆◆
1 01cssハック CSSハック CSSハックのサンプルコードです
1 →cssハック IE6ハック …CSSハック
1 →cssハック IE7ハック …CSSハック
1 →cssハック IE6ハック(Valid)
1 →cssハック * html #IE6 { }
1 →cssハック サンプルコード
1 →cssハック CSS
1 →cssハック * html p { color: #777777; }
1 →cssハック IE7ハック(Valid)
1 →cssハック *:first-child + html #IE7 { }
1 →cssハック サンプルコード
1 →cssハック CSS
1 →cssハック *:first-child + html p { color: #777777; }
1 →cssハック
2 02css(詳細) ◆◆◆css_(詳細)◆◆◆
2 →css(詳細) *CSS(スタイルシート)の定義 基本的な定義方法は、セレクタ{属性:値}と記述します。例えば、

タグに文字色青を設定する場合は以下のように記述します。

2 →css(詳細) p { color: #0000ff }
2 →css(詳細) また、1つのセレクタに複数の属性を定義することもできます。属性と属性の区切りには「;」を使用します。
2 →css(詳細) 例えば、

タグに文字色とフォントサイズを設定する場合は以下のように記述します。

2 →css(詳細) p {
2 →css(詳細) color: #0000ff; /*文字の色を青にする*/
2 →css(詳細) font-size: 1.5em; /*フォントサイズを1.5倍にする*/
2 →css(詳細) }
2 →css(詳細)
2 →css(詳細) *途中で入力した半角スペースや改行、タブはブラウザには反映されませんので、後で見たときにわかりやすい記述にするとよいでしょう。コメントを記述するのもよい方法です。CSSでのコメントは「/*」「*/」を使用し間にコメントを記述します。また、最後に設定した属性には区切りの「;」を記述する必要はありませんが、記述もれをなくすために常に記述するクセをつけるのもよいでしょう。
2 →css(詳細) 複数設定
2 →css(詳細) "同じスタイルを複数のセレクタに設定:セレクタ名を「,」で区切ります。"
2 →css(詳細) "h1,h2 {"
2 →css(詳細) color: #0000ff;
2 →css(詳細) }
2 →css(詳細)
2 →css(詳細) *タグ(HTML内)に複数のセレクタを設定:セレクタ名を「スペース」で区切ります。
2 →css(詳細) 記述例(CSS)
2 →css(詳細) .mojicolor {
2 →css(詳細) color: #0000ff;
2 →css(詳細) }
2 →css(詳細) .mojisize {
2 →css(詳細) font-size: 1.5em;
2 →css(詳細) }
2 →css(詳細) 記述例(HTML)
2 →css(詳細) "

"

2 →css(詳細) *セレクタ 基本セレクタ:
タグや

タグ、

タグ等。例えば、

タグに文字色青を設定した場合、HTML文書内すべてに記述されている

タグに反映され、青色で表示されます。

2 →css(詳細)
2 →css(詳細) p {
2 →css(詳細) color: #0000ff;
2 →css(詳細) }
2 →css(詳細)
2 →css(詳細) *IDセレクタ:ID名を定義します。定義方法は、ID名の前に「#」を付け、#ID名{属性:値}もしくは、基本セレクタ名#ID名{属性:値}と記述します。(基本セレクタ名と組み合わせて定義した場合は、組み合わせた要素に対してのみ有効です。)定義したIDは、1つのHTML文書内で1回しか使用できません。
2 →css(詳細) 記述例(CSS)
2 →css(詳細) #font-bule {
2 →css(詳細) color: #0000ff;
2 →css(詳細) }
2 →css(詳細) 記述例(HTML)
2 →css(詳細) "

"

2 →css(詳細)
2 →css(詳細) *CLASSセレクタ:CLASS名を定義します。定義方法は、CLASS名の前に「.」を付け、.CLASS名{属性:値}もしくは、基本セレクタ名.CLASS名{属性:値}と記述します。(基本セレクタ名と組み合わせて定義した場合は、組み合わせた要素に対してのみ有効です。)定義したCLASSは、複数の要素に使用することが可能です。
2 →css(詳細) 記述例(CSS)
2 →css(詳細) .back-bule {
2 →css(詳細) background-color: #0000ff;
2 →css(詳細) }
2 →css(詳細) 記述例(HTML)
2 →css(詳細) "

"

2 →css(詳細) 擬似クラス:タグ等、文章の設定とは関係のない要素を設定します。定義方法は、既に決められている予約語を組み合わせます。タグには、4つの予約語があります。
2 →css(詳細)
2 →css(詳細) *link:HTML文書内のタグで設定しているリンク先を、まだ訪れていない(キャッシュが残っていない)場合のスタイルを設定します。
2 →css(詳細) a:link { /*①*/
2 →css(詳細) color: #008000;
2 →css(詳細) }
2 →css(詳細) visited:HTML文書内のタグで設定しているリンク先を、訪れている(キャッシュが残っている)場合のスタイルを設定します。
2 →css(詳細) a:visited { /*②*/
2 →css(詳細) color: #ffff00;
2 →css(詳細) }
2 →css(詳細) hover:HTML文書内のタグで設定しているリンク先に、カーソルをのせている場合のスタイルを設定します。
2 →css(詳細) a:hover { /*③*/
2 →css(詳細) color: #ff0000;
2 →css(詳細) }
2 →css(詳細) active:HTML文書内のタグで設定しているリンク先を、クリックしている場合のスタイルを設定します。
2 →css(詳細) a:active { /*④*/
2 →css(詳細) color: #0000ff;
2 →css(詳細) }
2 →css(詳細)
3 01a_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のA、B)1◆◆◆
3 →a_css(ABC順)
3 02b_css(ABC順) background(背景)...背景に関する設定をまとめて指定します
3 →b_css(ABC順) background-attachment(背景)...背景に関する設定をまとめて指定します
3 →b_css(ABC順) background-color(背景)...背景色を指定します
3 →b_css(ABC順) background-color(罫線)...罫線の背景色を指定します
3 →b_css(ABC順) background-color(リンク)...リンクの背景色を指定します
3 →b_css(ABC順) background-color(テーブル)...テーブル、セルの背景色を指定します
3 →b_css(ABC順) background-color(フレーム)...インラインフレームの背景色を指定します
3 →b_css(ABC順) background-color(フォーム)...部品の背景色を指定します
3 →b_css(ABC順) background-image(背景)...背景画像を指定します
3 →b_css(ABC順) background-image(罫線)...罫線の背景画像を指定します
3 →b_css(ABC順) background-image(テーブル)...テーブル、セルの背景画像を指定します
3 →b_css(ABC順) background-image(フレーム)...インラインフレームの背景画像を指定します
3 →b_css(ABC順) background-position(背景)...背景画像の表示開始位置を指定します
3 →b_css(ABC順) background-repeat(背景)...背景画像のリピートを指定します
3 →b_css(ABC順) border(ボーダー)...ボーダーに関する設定をまとめて指定します
3 →b_css(ABC順) border(罫線)...罫線のボーダーを指定します
3 →b_css(ABC順) border(画像)...画像のボーダーを指定します
3 →b_css(ABC順) border(テーブル)...テーブル、セルのボーダーを指定します
3 →b_css(ABC順) border(フレーム)...インラインフレームのボーダーを指定します
3 →b_css(ABC順) border(フォーム)...部品のボーダーを指定します
3 →b_css(ABC順) border-bottom(リンク)...リンクの下線を指定します
3 →b_css(ABC順) border-collapse(テーブル)...セルのボーダー表示の仕方を指定します
3 →b_css(ABC順) border-color(ボーダー)...ボーダーの色を指定します
3 →b_css(ABC順) border-spacing(テーブル)...セルのボーダー間隔を指定します
3 →b_css(ABC順) border-style(ボーダー)...ボーダーのスタイルを指定します
3 →b_css(ABC順) border-width(ボーダー)...ボーダーの太さを指定します
3 →b_css(ABC順)
4 03c_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のC、D)1◆◆◆
4 03c_css(ABC順) caption-side(テーブル)...テーブルのキャプションの位置を指定します
4 →c_css(ABC順) clear(ボックス)...回り込みを解除します
4 →c_css(ABC順) clip(画像)...ブロックを切抜き表示します
4 →c_css(ABC順) color(フォント・テキスト)...文字色を指定します
4 →c_css(ABC順) color(リンク)...リンクの文字色を指定します
4 →c_css(ABC順) content(フォント・テキスト)...内容を挿入します
4 →c_css(ABC順) content/quotes(フォント・テキスト)...内容を挿入し、引用符を設定します
4 →c_css(ABC順) CSSハック...CSSハックのサンプルコードです
4 →c_css(ABC順) cursor(カーソル)...カーソルの形状を指定します
4 →c_css(ABC順)
4 04d_css(ABC順) direction(フォント・テキスト)...文字表記の方向を指定します
4 →d_css(ABC順) display(ボックス)...要素の表示形式を指定します
4 →d_css(ABC順)
5 05e_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のE、F)1◆◆◆
5 05e_css(ABC順) empty-cells(テーブル)...空白セルのボーダーの表示・非表示を指定します
5 →e_css(ABC順)
5 06f_css(ABC順) float(ボックス)...左または右に寄せて配置します
5 →f_css(ABC順) font(フォント・テキスト)...フォントに関する設定をまとめて指定します
5 →f_css(ABC順) font-family(フォント・テキスト)...フォントの種類を指定します
5 →f_css(ABC順) font-size(フォント・テキスト)...サイズを指定します
5 →f_css(ABC順) font-style(フォント・テキスト)...イタリック体・斜体を指定します
5 →f_css(ABC順) font-variant(フォント・テキスト)...フォントをスモールキャップにします
5 →f_css(ABC順) font-weight(フォント・テキスト)...太さを指定します
5 →f_css(ABC順)
6 07g_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のG、H)1◆◆◆
6 07g_css(ABC順)
6 →g_css(ABC順)
6 08h_css(ABC順) height(ボックス)...高さを指定します
6 →h_css(ABC順)
7 09i_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のI、J)1◆◆◆
7 09i_css(ABC順)
7 →i_css(ABC順)
7 10j_css(ABC順)
7 →j_css(ABC順)
8 11k_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のK、L)1◆◆◆
8 11k_css(ABC順)
8 →k_css(ABC順)
8 12l_css(ABC順) letter-spacing(フォント・テキスト)...文字の間隔を指定します
8 →l_css(ABC順) line-height(フォント・テキスト)...行の高さを指定します
8 →l_css(ABC順) list-style(リスト)...マーカーに関する設定をまとめて指定します
8 →l_css(ABC順) list-style-image(リスト)...マーカー画像を指定します
8 →l_css(ABC順) list-style-position(リスト)...マーカーの表示位置を指定します
8 →l_css(ABC順) list-style-type(リスト)...マーカー文字の種類を指定します
8 →l_css(ABC順)
9 13m_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のM、N)1◆◆◆
9 13m_css(ABC順) margin(ボックス)...マージンを指定します
9 →m_css(ABC順) min-height(ボックス)...高さの最小値を指定します
9 →m_css(ABC順) min-width(ボックス)...幅の最小値を指定します
9 →m_css(ABC順) max-height(ボックス)...高さの最大値を指定します
9 →m_css(ABC順) max-width(ボックス)...幅の最大値を指定します
9 →m_css(ABC順)
9 14n_css(ABC順)
9 →n_css(ABC順)
10 15o_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のO、P)1◆◆◆
10 15o_css(ABC順) outline(フォーム)...部品のアウトラインを指定します
10 →o_css(ABC順) outline(アウトライン)...アウトラインに関する設定をまとめて指定します
10 →o_css(ABC順) outline(リンク)...リンクアウトラインを指定します
10 →o_css(ABC順) outline-color(アウトライン)...アウトラインの色を指定します
10 →o_css(ABC順) outline-style(アウトライン)...アウトラインのスタイルを指定します
10 →o_css(ABC順) outline-width(アウトライン)...アウトラインの太さを指定します
10 →o_css(ABC順) overflow(ボックス)...はみ出した内容の表示方法を指定します
10 →o_css(ABC順)
10 16p_css(ABC順) padding(ボックス)...パディングを指定します
10 →p_css(ABC順) padding(テーブル)...セル内のパディングを指定します
10 →p_css(ABC順) page-break-after(印刷)...印刷の改ページ箇所を指定します
10 →p_css(ABC順) page-break-before(印刷)...印刷の改ページ箇所を指定します
10 →p_css(ABC順) position(ボックス)...ボックスレイアウトを指定します
10 →p_css(ABC順) position(リンク)...リンクの位置を指定します
10 →p_css(ABC順)
11 17q_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のQ、R)1◆◆◆
11 17q_css(ABC順)
11 →q_css(ABC順)
11 18r_css(ABC順)
11 →r_css(ABC順)
12 19s_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のS、T)1◆◆◆
12 19s_css(ABC順)
12 →s_css(ABC順)
12 20t_css(ABC順) table-layout(テーブル)...テーブルの表示方法を指定します
12 →t_css(ABC順) text-align(フォント・テキスト)...位置・均等割付を指定します
12 →t_css(ABC順) text-align/margin(罫線)...罫線の位置を指定します
12 →t_css(ABC順) text-align/vertical-align(テーブル)...横位置・縦位置を指定します
12 →t_css(ABC順) text-decoration(フォント・テキスト)...テキストの装飾を指定します
12 →t_css(ABC順) text-decoration(リンク)...リンクの装飾を指定します
12 →t_css(ABC順) text-indent(フォント・テキスト)...インデントの幅を指定します
12 →t_css(ABC順) text-transform(フォント・テキスト)...大文字、小文字を指定します
12 →t_css(ABC順)
13 21u_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のU、V)1◆◆◆
13 21u_css(ABC順) unicode-bidi(フォント・テキスト)...Unicodeの文字表記の方向を上書きします
13 →u_css(ABC順)
13 22v_css(ABC順) vertical-align(フォント・テキスト)...縦方向の位置を指定します
13 →v_css(ABC順) vertical-align(画像)...画像の縦方向の位置を指定します
13 →v_css(ABC順) visibility(ボックス)...ボックスの表示・非表示を指定します
13 →v_css(ABC順) visibility(テーブル)...テーブルの行または行の表示・非表示を指定します
13 →v_css(ABC順)
14 23w_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のW、X)1◆◆◆
14 23w_css(ABC順) white-space(フォント・テキスト)...スペース、タブ、改行の仕方を指定します
14 →w_css(ABC順) white-space(テーブル)...セル内のスペース、タブ、改行の仕方を指定します
14 →w_css(ABC順) width(ボックス)...幅を指定します
14 →w_css(ABC順) width/height(罫線)...罫線の幅・高さを指定します
14 →w_css(ABC順) width/height(テーブル)...テーブル、セルの幅・高さを指定します
14 →w_css(ABC順) width/height(フレーム)...インラインフレームの幅・高さを指定します
14 →w_css(ABC順) width/height(フォーム)...部品の幅・高さを指定します
14 →w_css(ABC順) word-spacing(フォント・テキスト)...単語の間隔を指定します
14 →w_css(ABC順)
14 24x_css(ABC順)
14 →x_css(ABC順)
15 25y_css(ABC順) ◆◆◆css(CSSプロパティ・ABC順のY、Z)1◆◆◆
15 25y_css(ABC順)
15 →y_css(ABC順)
15 26z_css(ABC順) z-index(ボックス)...重なりの順序を指定します
15 →z_css(ABC順) Other
15 →z_css(ABC順)
16 01css(CSS3) ◆◆◆01css_(CSS3)1◆◆◆
16 →css(CSS3) CSS3
16 →css(CSS3) CSS3を使ってみる!
16 →css(CSS3) クロスブラウザ対応のCSS3サンプル
16 →css(CSS3) CSS3を使ってみる!
16 →css(CSS3) CSS3を使ってみる上で知っておきたいことをまとめました。
16 →css(CSS3) 参考にしてください^^。
16 →css(CSS3)
16 →css(CSS3) Vendor-Prefix
16 →css(CSS3) CSS3を使ってみる上でまず知っておきたいことは、モダンブラウザでは少しづつCSS3が使えるようになってきていますが現時点ではいまだ草案段階なので先行実装という意味の「Vendor-Prefix」という識別子がCSS3を使う上で必要になります。
16 →css(CSS3) *Vendor-Prefixはブラウザごとに異なり現在4つのPrefixがあります。
16 →css(CSS3)
16 →css(CSS3) ブラウザ Prefix
16 →css(CSS3) "Safari,Chrome -webkit- "
16 →css(CSS3) Firefox -moz-
16 →css(CSS3) Opera -o-
16 →css(CSS3) Internet Explorer -ms-
16 →css(CSS3)
16 →css(CSS3) 書き方はVendor-Prefixごとに同じプロパティをそれぞれ記述します。
16 →css(CSS3) Prefixは概ねプロパティに付けますが値に付けることもありますのでご注意ください。
16 →css(CSS3)
16 →css(CSS3) IE対策
16 →css(CSS3) IE9はCSS3対応ということですが、IE6、IE7、IE8では?
16 →css(CSS3) IE9の正式版がCSS3対応でもIE6、IE7、IE8でCSS3が対応してないと困ります。
16 →css(CSS3) そこでCSS3をIE6、IE7、IE8でも使用可能にしてくれるbehaviorスクリプトを利用します。
16 →css(CSS3) CSS3のIE対策には「ie-css3」、「CSS3 PIE」などのbehaviorスクリプトがありますが
16 →css(CSS3) 今回は「CSS3 PIE」を使用してサンプルを作ってみます。
16 →css(CSS3)
16 →css(CSS3) CSS3 PIEを下記よりダウンロードしてください。
16 →css(CSS3) CSS3 PIEダウンロード
16 →css(CSS3)
16 →css(CSS3) ダウンロードした「PIE.htc」ファイルを任意の場所に保存してください。その際パスは絶対パスで記述してください。
16 →css(CSS3)
16 →css(CSS3) *「CSS3 PIE」の使い方はスタイルシートに次の一行を追加するだけです
16 →css(CSS3) behavior: url(/PIE.htc);
16 →css(CSS3)
16 →css(CSS3) .box {
16 →css(CSS3) "-moz-border-radius: 5px;/*Safari,Chrome*/"
16 →css(CSS3) -webkit-border-radius: 5px;/*Firefox*/
16 →css(CSS3) "border-radius: 5px;/*Opera,IE*/"
16 →css(CSS3) behavior: url(/PIE.htc);
16 →css(CSS3) }
16 →css(CSS3)
16 →css(CSS3) クロスブラウザに対応したCSS3のサンプル
16 →css(CSS3) ここでは「PIE.htc」と「ie-css3.htc」を使用して角丸、シャドー、グラデーションのサンプルを作ってみます。
16 →css(CSS3) ただし、クロスブラウザ対応と言っておきながら「PIE.htc」ではOperaでグラデーションは効きません。
16 →css(CSS3) 「ie-css3.htc」ではIEとOperaでグラデーションが効きません。影の色も変わりませんorz
16 →css(CSS3)
16 →css(CSS3) サンプルコード
16 →css(CSS3) HTML
16 →css(CSS3) "
"
16 →css(CSS3) "
"
16 →css(CSS3) CSS3を使って見出しを作る
16 →css(CSS3)
16 →css(CSS3)
16 →css(CSS3) CSS
16 →css(CSS3) .box {
16 →css(CSS3) width: 99%;
16 →css(CSS3) margin: 0 auto;
16 →css(CSS3) }
16 →css(CSS3)
16 →css(CSS3) .boxinner {
16 →css(CSS3) color: #eeeeee;
16 →css(CSS3) text-align: left;
16 →css(CSS3) background: #9fb7d4;/*Operaがグラデーション未対応のため代わりの背景色*/
16 →css(CSS3) padding: 10px;
16 →css(CSS3) /*角丸*/
16 →css(CSS3) -webkit-border-radius: 5px;
16 →css(CSS3) -moz-border-radius: 5px;
16 →css(CSS3) border-radius: 5px;
16 →css(CSS3) /*シャドー*/
16 →css(CSS3) -webkit-box-shadow: 0px 2px 3px #777;
16 →css(CSS3) -moz-box-shadow: 0px 2px 3px #777;
16 →css(CSS3) box-shadow: 0px 2px 3px #777;
16 →css(CSS3) /*グラデーション*/
16 →css(CSS3) "background: -webkit-gradient(linear,left top left bottom
16 →css(CSS3) "background: -moz-linear-gradient(top,#eeeeee #9fb7d4);"
16 →css(CSS3) "background: linear-gradient(#eeeeee,#9fb7d4);"
16 →css(CSS3) "-pie-background: linear-gradient(#eeeeee,#9fb7d4);/*IEのグラデーションには通常の記述にあわせてこの一行も必要*/"
16 →css(CSS3) /*CSS3 PIE*/
16 →css(CSS3) behavior: url(/PIE.htc);
16 →css(CSS3) }
16 →css(CSS3) サンプル画面表示イメージ
16 →css(CSS3) 「PIE.htc」を使ったCSS3サンプル画面表示はこちら!
16 →css(CSS3)  ∟サンプルダウンロード
16 →css(CSS3)
16 →css(CSS3) 「ie-css3」を使ったCSS3サンプル画面表示はこちら!
16 →css(CSS3)