CSSプロパティの概要

巴扎黑
リリース: 2017-07-23 16:38:57
オリジナル
1193 人が閲覧しました

一般的な CSS プロパティ:

フォント属性: (フォント)
size font-size: x-large; (特大) xx-small; (非常に小さい) 通常、中国語では使用されません。単位は PX、PD です。
スタイル font-style: oblique;(Italic) italic;(Italic)normal;(Normal)
Line-height:normal;(Normal) Unit: PX、PD、EM
Thickness font -weight:太字; 軽い; フォント バリアント: 小文字 通常; 通常のテキスト変換: 大文字;(大文字) 小文字;(小文字) なし;(なし)
下線;(アンダーライン) 上線;(上線) ラインスルー;(行の削除) ブリンク; (フラッシュ)
よく使用されるフォント: (font-family)
"Courier New"、Courier、monospace、"Times New Roman"、Times、セリフ、Arial、Helvetica、sans-serif、Verdana
背景属性
: (background)
color画像の背景画像: url();
repeat background-repeat : no-repeat;
スクロール背景-添付:固定;(固定)スクロール; (スクロール)
位置背景-位置:左(水平)上(垂直);
省略方法背景: #000 URL (..) 繰り返し固定左上;
ブロック属性
: (ブロック)
文字間隔: 通常; 値text-align: justify;(両端揃え) left;(左揃え) ) right;(右揃え) center;(中央)
インデント text-indent: 値 px;
垂直方向の配置: ベースライン; サブ (下付き) スーパー; text-top; middle; text-bottom;
word-spacing: 通常; value
white-space: pre;(予約済み) nowrap;(改行なし)
display:block;(ブロック)インライン;(埋め込み)リスト項目;(追加部分)コンパクト;テーブル-ヘッダーグループ; ; テーブルフッターグループ; テーブル列グループ; (テーブルタイトル)
幅:;高さ:; 浮動小数点数:; 余白:; 順序: 上、右、下、左
境界線のスタイル: (点線) ; (破線) 二重; 溝 (溝) インセット;
border-color:; 略語メソッド border: width style color ;
List属性
: (List-style)type list-style-type: disc;(dot) Circle;(circle) square;(square) 10進数;(数値) lower-roman;( 下位アルファ; 上位アルファ;
位置 list-style-position: 外側; (外側) 内側;
画像 list-style-image: url(..);
位置属性: (位置)
位置: 相対;
可視性;クリップ: スクロール(12px,auto,12px,auto) (トリミング)

css 属性コードリスト
1 つの CSS テキスト属性:
color : #999999; /*Text color*/
font- family : 宋体,sans-serif; /*テキストフォント*/
font-size : 9pt; /*テキストサイズ*/
font-style:itelic; /*テキストイタリック*/
font-variant : small-caps; /*小さいフォント*/

文字間隔 : /*文字間のスペース*/ line-height : 200%; /*行の高さを設定*/
font-weight:bold; /*テキストを太字にする*/
vertical-align:sub /*下付き文字*/
vertical-align :super; /*上付き*/
text-decoration:line-through; /*取り消し線を追加*/
text-decoration:overline; /*先頭行を追加*/
text-decoration:underline; /*underline*/
text-decoration:none; /*リンクの下線を削除*/
text-transform : /*最初の単語を大文字にする*/
text-transform / *テキストを左揃え* /
text-align:center; /*テキストの中央揃え*/
text-align:justify; /*テキストの配置*/
vertical-align 属性
vertical-align:top;垂直上に整列します*/
vertical-align:bottom; /*垂直に下に整列します*/
vertical-align:middle; /*垂直に中央に整列します*/
vertical-align ;上の境界線を空白のままにします*/
padding-right:10px; /*右側の境界線を空白のままにします*/
padding-bottom:10px; /*下の境界線を空白のままにします*/
padding-left:10px; /*左側の境界線を空白のままにします
3. CSS シンボル属性:
list-style-type:none; /*Unnumbered*/
list-style-type:decmal;
list-style-type: lower-roman; /*小文字のローマ数字*/
list-style-type:upper-roman; /*大文字のローマ数字*/
list-style-type: lower - alpha; /*英小文字*/
list-style-type:upper-alpha; /*英大文字*/
list-style-type:disc; list-style-type:circle; /*中空円記号*/
list-style-type:square; /*実線四角記号*/
list-style-image:url(/dot.gif); /*図記号*/
list-style-position:Outside; /*凸行*/
list-style-position:inside; /*インデント*/
4. CSS 背景スタイル:
/*背景色*/ background:transparent; /*遠近感のある背景*/
background-image : url(/image/bg.gif) /*背景画像*/
background-attachment : fix; /*ウォーターマーク固定背景*/
background-repeat; /*リピート配置 - Webページのデフォルト*/
background-repeat : no-repeat; /*リピート配置なし* /
background -repeat :repeat-x; /*x軸の配置を繰り返します*/
background-repeat :repeat-y; /*y軸の配置を繰り返します*/
背景の位置を指定します
background-position : 90% 90%; /*背景画像の x 軸と y 軸の位置*/
background-position : /*上に揃えます*/
background-position : butt ; /*下揃え */
background-position : left; /*左揃え*/
background-position : right; /*右揃え*/
background-position : center; */
5. CSS 接続プロパティ:
a /*すべてのハイパーリンク*/
a:link /*ハイパーリンクのテキスト形式*/
a:visited /*表示されたリンクのテキスト形式*/
a:active /*押されたリンクの形式*/
a:hover /*マウスでリンク*/
マウスカーソルのスタイル:
リンク指 CURSOR: 手
クロスカーソル:十字線
下向きの矢印:s-resize
十字矢印カーソル:移動
右向き矢印カーソル:移動
疑問符カーソルの追加:ヘルプ
左向き矢印カーソル:w-resize
上向き矢印カーソル:n -resize
右上矢印カーソル:ne-resize
左上矢印カーソル:nw-resize
テキスト私が入力したカーソル:テキスト
右斜め下矢印カーソル:se -resize
斜めに矢印左下カーソル:sw-resize
ファンネルカーソル:wait
カーソルパターン(IE6) p {cursor:url("カーソルファイル名.cur"),text;}
六、CSSボーダーリスト:
border-top : 1px ソリッド #6699cc; /*上ボーダー*/
border-bottom : 1px ソリッド #6699cc;
border-left : 1px ソリッド #6699cc; border line*/
border-right : 1px Solid #6699cc; /*右ボーダーライン*/
上記は推奨の書き方ですが、以下のように従来の方法でも構いません。 top-color : #369 /*上枠の上の色を設定します*/
border-top-width: 1px /*上枠の上の幅を設定します*/
border-top-style:solid /*上部フレームの上部スタイルを設定します*/
その他のフレームスタイル
solid /*solid Frame*/
dotted /*点線フレーム*/
double /*Double Frame*/
溝 /*立体的な内側凸フレーム*/
リッジ /*立体レリーフフレーム*/
インセット /*凹フレーム*/
アウトセット /*凸フレーム*/
7. CSS フォームの使用法:
テキスト ボックス
ボタン
チェック ボックス
選択ボタン
複数行テキスト ボックス
ドロップダウン メニュー オプション 1 オプション 2
8.境界線のスタイル:
margin-top:10px; /*上マージン*/
margin-right:10px; /*右マージン値*/
margin-bottom:10px; /*下マージン値*/
margin- left:10px; /*左枠値*/

CSSプロパティ: フォントスタイル (フォントスタイル)
シリアル番号 中国語の説明マーク構文
1 フォントスタイル {font:font-style font-variant font -weight font-size font-family}
2 フォントの種類 {font-family:"フォント 1","フォント 2","フォント 3",...}
3 フォント サイズ {フォント サイズ: 大きい | x-大きい |
5 フォントの太さ: 100-900 | 太字 | 標準
6 フォントの色 {color:value;} 7 影の色 {text-shadow: 16 ビットのカラー値}
8 フォントの行の高さ {line-height: 数値|継承|通常;}
9 文字間隔 {letter-spacing: 数値|継承|normal}
10 単語間隔 {word-spacing:numeric|inherit|normal}
11 フォント変換 {font-variant:inherit|normal|small-cps}
12 英語変換 {text-transform:継承|なし |大文字|大文字|小文字}
13 フォント変形 {font-size-adjust:inherit|none}
14 フォント {font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit |狭い|標準|半拡張|超凝縮|超拡張|広い}
テキストスタイル (テキストスタイル)
シリアル番号 中国語の説明マーク構文
1行間隔高さ: 数値| 継承|標準;}
2 テキスト装飾 {text-decoration:inherit|none|underline|overline|line-through|blink}
3 段落の先頭のスペース {text-indent:数値|継承}
4 水平方向の配置 {text-align:left|right|center|justify}
5 垂直方向の配置 {vertical-align:inherit|top|bottom|text-top|text-bottom|baseline |middle|sub|super}
6 書き込みモード {writing-mode:lr-tb|tb-rl}
背景スタイル
シリアル番号 中国語記述マーク構文
1 背景色 {
2 背景画像 {background-image: url( URL)|none}
3 背景の繰り返し {background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}
4 背景固定 {background -attachment:fixed|scroll}
5 背景の位置 {background-position: value|top|bottom|left|right|center}
6 バックスタイル {background: 背景色|背景画像|背景リピート|背景アタッチメント|背景位置}
フレームスタイル(ボックススタイル)
シリアル番号 中国語記述マーク構文
1 margin {margin:margin-top margin-right margin-bottom margin-left}
2 padding {padding :padding-toppadding-rightpadding-bottompadding-left}
3 ボーダーの幅 {border-width:border-top-width border-right-width border-bottom-width border-left-width}
Width value: 細い|中|太い| 数値
4 境界線の色 {border-color: 数値 数値} 数値: 上下左右の色の値を表す
5 境界線のスタイル {border- style:none|hidden|inherit|dashed|solid |double|inset|outset|ridge|groove}
6 ボーダー {border:border-width border-style color}
上のボーダー {border-top:border-上部の幅の境界線スタイルの色}
右の境界線 {border-right:border-right-width 境界線のスタイルの色}
下の境界線 {border-bottom:border-bottom-width 境界線のスタイルの色}
左ボーダー {border-left:border-left -width border-style color}
7 width {width: length | パーセント auto}
8 height {height: value auto}
9 float { float:left|right|none}
10 Clear {clear:none|left|right|both}
カテゴリリスト
シリアル番号 中国語説明マーク構文
1 コントロールディスプレイ {display:none|block |inline|list-item}
2 コントロール空白 {white-space:normal|pre|nowwarp}
3 シンボルリスト {list-style-type:disc|circle|square|decim| lower-roman|upper -ローマ|下位アルファ|上位アルファ|なし }
4 グラフィックリスト {list-style-image:URL}
5 位置リスト {list-style-position:inside|outside}
6 ディレクトリリスト {list-style: ディレクトリスタイルタイプ|ディレクトリスタイル位置|url }
7 マウスの形状 {カーソル:手|クロスヘア|テキスト|待機|移動|ヘルプ|e-resize|nw-resize|w-resize|s-resize|se-resize|sw-resize}

以上がCSSプロパティの概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート