CSS3の新機能は何ですか?新しい属性とは何ですか? （要約）

この記事の主な目的は、CSS3 の新機能を要約して紹介することです。

まず、皆さんは CSS とは何なのかを知っておく必要があります。

簡単に言えば、CSS はカスケード スタイル シートであり、HTML や XML などのファイル スタイルを表現するために使用されるコンピューター言語です。そして css3 は最新の CSS 標準です。 css と css3 のさまざまなスタイル属性をマスターできれば、誰でも簡単に美しくボリュームのあるページを作成できると思います。

css3 は CSS の最新標準ですが、css3 の新機能は何ですか?

以下では、簡単なコード例を組み合わせて、いくつかの重要な新機能、つまり新しい属性を要約します。

1. RGBA と透明度

RGBA は RGB カラー モデルの拡張です。本質的には、セット要素にアルファ チャネルも追加します。つまり、赤、緑、青の 3 色に加えて、透明度を表すチャネルも追加されます。そのうちの RGB 値はそれぞれ赤、緑、青を表し、アルファ値の範囲は 0 ～ 1 (小数点以下 1 桁) です。

2. 背景属性

background-image: 要素の背景画像を設定します。

background-origin: 背景画像の配置領域を指定します。

background-size: 背景画像のサイズを指定します。

background-repeat: 背景画像を繰り返すかどうか、および繰り返す方法を設定します。

3. ワードラップ属性

ワードラップ属性を使用すると、長い単語や URL アドレスを次の行に折り返すことができます。

注: すべての主要なブラウザはワードラップ属性をサポートしています。

基本構文:

word-wrap: normal|break-word;

4. text-shadow 属性

text-shadow 属性: テキストに影を設定します。

テキストシャドウの基本構文:

text-shadow： 5px 5px 5px #FF0000;

パラメータはそれぞれ、水平シャドウ、垂直シャドウ、ブラー距離、シャドウカラーを表します。

5。 font -face 属性

font-face 属性: 独自のフォントを定義します

新しい @font-face ルールでは、最初にフォントの名前 (myFirstFont など) を定義する必要があります。 )、フォント ファイルをポイントします。

6. border-radius 属性

border-radius 属性: 4 つの border-*-radius 属性を設定するために使用される省略された属性です。

基本構文:

border-radius: 1-4 length|% / 1-4 length|%;

注: この属性を使用すると、要素に丸い境界線を追加できます。

7. border-image 属性

border-image: div 要素を囲む境界線として画像を指定します

border-image 基本構文:

border-image: url(border.png) 30 30 round

8. box-shadow 属性

box-shadow 属性: ボックスに 1 つ以上の影を追加します。 (ボックス シャドウ)

box-shadow 基本構文:

box-shadow: 10px 10px 5px #888888

9. メディア クエリ

メディア クエリは、ブラウザーで 2 つの CSS を定義します。サイズが変わると異なるプロパティが採用されます。

この記事は、CSS3 の新機能のいくつかの重要な属性をまとめたものです。CSS 面接の質問では、CSS3 の新機能に関する質問もよくあります。この記事が困っている友達のお役に立てれば幸いです!

css/css3 の知識ポイントについて詳しく知りたい場合は、PHP 中国語 css ビデオ チュートリアル /css3 ビデオ チュートリアル に注目してください。どなたでもご覧いただけます。参考にして学んでください！

以上がCSS3の新機能は何ですか?新しい属性とは何ですか? （要約）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。