ホームページ >ウェブフロントエンド >H5 チュートリアル >HTML5 のいくつかの新しい背景属性とテキスト属性の紹介

HTML5 のいくつかの新しい背景属性とテキスト属性の紹介

黄舟
黄舟オリジナル
2017-10-23 10:11:541865ブラウズ

1. 背景画像の表示:

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

value: ピクセル値、パーセント、自動、カバー、contain

②背景画像の開始位置を指定します。

値:padding-box (デフォルト)、content-box、border-box

③background-clip

値:padding-box、content-box、border-box (デフォルト)

2. HSLA:

新規カラー属性 ;

H: 色相

S: 彩度

L: 明るさ

A: 透明度

3. 新しいグラデーションカラー:

radial-gradient:(*position(deg),color percentage,color percentage);径向渐变
linear-gradient:(*position,color percentage,color percentage);线性渐变

4. 新しい反射:

-webkit-box-reflect:(direction,offset,color(可线性),url)

5. MASKS マスク、マスク:

-webkit-mask:(url,repeat,position,size)

6. カスタム フォント:

@font-face{
  font-family:'iconfont';定义字体名
  src:url(‘iconfont.tff’);加载字体
}

7. 複数行テキスト省略記号: (合計 4 行の CSS)

-webkit-box-orient:vertical  =>文本垂直显示
-webkit-line-clamp:3  =>显示 3 行文本
display:webkit-box  =>弹性盒模型
overflow:hidden  =>溢出隐藏

8. テキスト シャドウ: (組み合わせて使用​​できます)

text-shadow : オフセットX、オフセットY、ぼかし距離、色

以上がHTML5 のいくつかの新しい背景属性とテキスト属性の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。