CSS3 の新しい背景プロパティとは何ですか?

CSS の背景属性と CSS3 の新しい背景属性をいくつかまとめてみましょう。

background:

background-color:背景色

background-image:背景画像

background-repeat:背景の繰り返し

background-position:背景の位置

背景添付ファイル:背景固定/固定)

background-size 背景サイズ

background-size:x y

background-size:100% 100%

background-size:cover 比例拡大

background-size:contain を含む(画像)オーバーフローなし)

複数の背景

Background:url() 0 0,url() 0 100%;

background-origin 背景領域の配置

border-box: 境界領域から背景を表示します。

padding-box: パディング領域から背景を表示します。

content-box: コンテンツ領域から背景を表示します。

background-clip 背景描画領域

border-box: 境界領域の外側に背景をトリミングします。

パディングボックス: パディング領域の外側に背景をトリミングします。

content-box: コンテンツ領域の外側にある背景をトリミングします。

text: 背景の塗りつぶしテキスト //サポートされていません

no-clip: 境界領域から外側に背景をトリミングします。

カラーグラデーション

線形グラデーション: -webkit-linear-gradient (開始点/角度、色の位置、...,)

開始点: 左/上/右/下/左上...デフォルトの上

角度: 反時計回り 0-360 度

色の位置: 赤 0、青 50%、黄 100% (赤の 50% から青 100% へのグラデーション)

カラー グラデーション

繰り返し線形グラデーションの繰り返しタイリング

IE 低バージョン グラデーション (フィルター):

filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#ff0000',GradientType='1');

Color Gradient

放射状グラデーション: 放射状グラデーション(開始点(円の中心位置)、形状/半径/サイズ、色1、色2)

開始点:左/上/右/下または特定の値/パーセント

形状:楕円(楕円) )、円(正円)

サイズ: 特定の値またはパーセンテージ、またはキーワード (最近接 (最近端)、最近接角 (最近接角)、最も遠い側 (最も遠い端) 、最も遠い角 (最も遠い角) 、contain (含む)、cover (カバー));

注: Firefox は現在、キーワードのみをサポートしています

背景に関する CSS プロパティが非常にたくさんあるため、オンラインの php 中国語のその他の関連記事に注目してください。

関連記事:

HTMLでDIVが重なっている場合の対処法

margin 0 autoの使い方

HTMLにおけるbr、p、DIVの違いは何ですか

以上がCSS3 の新しい背景プロパティとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。