CSSの基本

WBOY
リリース: 2016-09-20 03:29:57
オリジナル
1071 人が閲覧しました

1.基本的な文法仕様

Analyze Analyze典型的な

CSSSステートメント:P{color:#ff0000; background:#ffffff}

"p" "p"; のスタイルを定義することを示します ·スタイル宣言は "{}" で記述されます。 background
"property"(property)
と呼ばれ、異なるプロパティはセミコロン ";" ·"#ff0000"; "#ffffff "は属性(値)の値です。
2.色の値色の値は、RGB値で書き込むことができます。例:
color : rgb(255,0,0)

、または16進数で書き込むことができます。 、上の例のように色: #FF0000。 16 進値がペアで繰り返される場合、同じ効果で省略できます。たとえば、
: #FF0000
は、#F00と書くことができます。ただし、重複しない場合は省略できません。たとえば、#FC1A1B は 6 桁の数字で埋めなければなりません。

3.定义字体
web标准推荐如下字体定义方法:
body { font-family : "Lucida Grande", Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif; } 
字体按照所列出的顺序选用。如果用户的计算机含有Lucida Grande字体,文档将被指定为Lucida Grande。没有的话,就被指定为Verdana字体,如果也没有Verdana,就指定为Lucida字体,依此类推,; 
·Lucida Grande字体适合Mac OS X 
·Verdana字体适合所有的Windows系统; 
·Lucida适合UNIX用户 
·"宋体"适合中文简体用户
如果所列出的字体都不能用,则默认的sans-serif字体能保证调用

4.群选择器
当几个元素样式属性一样时,可以共同调用一个声明,元素之间用逗号分隔,:
 p, td, li { font-size : 12px ; } 

5.派生选择器
可以使用派生选择器给一个元素里的子元素定义样式,例如这样:
li strong { font-style : italic; font-weight : normal
就是给li下面的子元素strong定义一个斜体不加粗的样式。

6.id选择器
CSS布局主要用层“div”来实现,而div的样式通过“id选择器”来定义。例如我们首先定义一个层

menubar>


次に、スタイルシートで次のように定義します:
#menubar {MARGIN: 0px;BACKGROUND: #FEFEFE;COLOR: #666;}
ここでmenubar」は独自の定義ですid 名前。先頭に「#」を追加することに注意してください。
idセレクターは派生もサポートしています。例:
#menubar p { text-align : right; margin-top : 10px; }
このメソッドは主に、より複雑で複数のレイヤーを定義するために使用されます。派生要素。

7.カテゴリセレクター
CSSの先頭にドットを使用して、カテゴリセレクターの定義を示します。例:
.14px {color : #f60 ;font-size:14px ;}
ページで、class="カテゴリ名" メソッド呼び出しを使用します:
14px size font
このメソッドシンプルで柔軟なため、いつでも必要に応じてページを作成および削除できます。

7.リンク スタイルを定義する
CSS は 4 つの疑似クラスを使用してリンク スタイルを定義します。つまり、a:linka:visiteda:hover a : active、例:
a:link{font-weight :bold ;text-decoration : none ;color : #c00 ;}
a:visited {font-weight :bold ;text-decoration : none ;カラー : #c30 ;}
a:hover {フォントの太さ : 太字 ;テキスト装飾 : 下線 ;カラー : #f60 ;}
a:active {フォントの太さ : 太字 ;テキスト装飾 : なし ;カラー : # F90 ;}
上記のステートメントはそれぞれ、" リンク、訪問済みリンク、マウスが上に停止したとき、およびマウスがクリックされたとき " のスタイルを定義します。

注:

上記の順番で書かないと予想と異なる表示になる可能性があります。注文はLVHA」であることを覚えておいてください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!