Atitti CSS3 の新機能の概要 attilax

Atitti CSS3新機能attilax概要

画像グロー効果2

透明グラデーション効果2

テキストストローク2

背景ストレッチ2

CS S3 セレクター 4

@Font-face機能 7

ワードラップ & テキストオーバーフロー スタイル 9

ワードラップ 9

テキストオーバーフロー 10

テキスト装飾ストローク 12

CSS3 複数列レイアウト (複数列レイアウト) 13

ボーダーと色 (色、境界線) 14

CSS3 グラデーション効果 (Gradient) 15

線形グラデーション 15

放射状グラデーション 16

CSS3 影 (Shadow) と反射 (Reflect) 効果 19

CSS3 背景効果 21

CSS3 ボックスモデル 23

CSS3 トランジション、変換、アニメーション 30

トランジション 30

トランスフォーム 31

アニメーション 33

画像のグロー効果

text-shadow:#000 3px 0 0,#000 0 3px 0,#000 -3px 0,#0 00 0 -3px 0;

各面の照明効果を設定できますが、これは少し複雑です。 。

透明なグラデーション効果

背景:radial-gradient(circle, rgba(230,251,12,1.00) 40% , rgba(230,251,12,1.00) , rgba(230,251,12,0)) ; /* 標準構文 * /

テキストストローク

は、テキスト装飾ストロークを使用して実行する必要があります。 。グロー効果は許容範囲ですが、単一の効果は良くありません

背景のストレッチ

background-size:100% 100%;

CSS3のTransitions、Transforms、Animation30

Transitions30

transition-property:トランジション効果の指定

Transform31

Animation33

に使用されます