CSS アプリケーション two_html/css_WEB-ITnose

1. スタイルで問題を注文します。

パディング、マージン、ボーダーなどはすべて時計回り、上​​、右、下、左に割り当てられます。

Padding:1px 2px 3px 4px;(top:1px;right:2px;bottom:3px;left:4px;)

Border-radius:3px; は、四隅がすべて 3 ピクセル丸められることを意味します。

境界線の半径: 3px 4px 5px 6px; 左上は 3px、右下は 5px、左下は 6px;スタイル上の略語。

1. よくこのような書き方を見かけます:

margin: 0 3px; 上下の値が同じ、左右が同じ場合、このように省略できます。

Margin: 1px 3px 2px; この書き方は、上の値は 1px、下の値は 2px; 左と右の値は 3px のみです

整列とtext-align 属性、テーブル内で align を使用して、テーブルの中央揃えスタイルを設定できます。 text-align:center を使用して、中国語のテキストを Div の中央に配置します。

幅とマージンは中心に合わせて定義されます。例: width="200px"; margin: 0 auto;

1. 位置: 絶対; left: 1px;
   Position の使用について属性値 。ブラウザ ウィンドウを基準にして相対的に配置された絶対配置要素を生成します。左、右、下、左を通して位置を制御します。位置を設定すると、ブラウザの対応する位置に固定され、ブラウザのコンテンツのスクロールと一緒にスクロールすることはありません。ポップアップ ウィンドウやプロンプト ボックスなどでよく使用されます。例: 位置: Left20px; トップ: 30px;
   3. アニメーション アニメーション属性
Animation は、6 つのアニメーション属性を設定するために使用されます。セレクター名に。
animation-duration は、アニメーションが完了するまでにかかる時間を秒またはミリ秒で指定します。

animation-timing-function はアニメーションの速度曲線を指定します。

animation-delay は、アニメーションが開始されるまでの遅延を指定します。
animation-iteration-count は、アニメーションを再生する回数を指定します。

animation-direction は、アニメーションを順番に逆方向に再生するかどうかを指定します。

属性は次のように定義されます: アニメーション: 名前 持続時間 タイミング-関数 遅延 反復回数 方向;

例: anime:myfirst 5s; 時間 5 秒の myfirst という名前のアニメーションを定義します。

@keyframes myfirst

{

from {background:red;}

to {background: yellow;}

} このアニメーションを定義するには、背景は赤と黄色で構成されます。

animation-timing-function はアニメーションの速度曲線を指定します。

カーブには次のものが含まれます (

linear: アニメーションの速度は最初から最後まで同じです。

ease: デフォルト。アニメーションは低速で始まり、その後速度が上がり、終了する前に遅くなります。

ease- in: アニメーションは低速で開始されます。

ease-out: アニメーションは低速で終了します。

cubic-bezier(n, n,n,n): 3 次ベジェ関数内の独自の値。可能な値は 0 から 1 までの数値です。