亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

CSS3 テキスト効果

1. text-shadow屬性の使い方

text-shadow屬性の使い方は以下の通りです。

text-shadow:length length length color

このうち、最初の3つの長さは、テキストからの影の水平方向の距離、テキストからの影の垂直方向の距離、および影のぼかし半徑を指します。影の色に。

以下は text-shadow 屬性の使用例です。この例では、赤いテキストのブロックがグレーの網(wǎng)掛けで表示されます。影とテキスト間の水平距離と垂直距離は両方とも 5 ピクセルです。

.wrap{
text-shadow:5px 5px 5px gray;
color:red;font-size:50px;
font-weight:bold;
}

2. 複數(shù)の影を指定する

text-shadow 屬性を使用して、テキストに複數(shù)の影を指定し、各影に異なる色を使用できます。

複數(shù)のシャドウを指定する場合は、カンマを使用して複數(shù)のシャドウを區(qū)切ります。今のところ、この機能をサポートしているのは Firefox、Chrome、Opera ブラウザのみです。

サンプルコード

テキストのオレンジ、黃色、緑の影を順番に指定し、これらの影の適切な位置も指定します。

.wrap {
  text-shadow:10px 10px #f39800,40px 35px #fff100,70px 60px #c0ff00;
color:navy;
font-size:50px;
font-weight:bold;
}

ワードラップ

長すぎる?yún)g語は、特定の領(lǐng)域を超えて収まらない可能性があります:

QQ圖片20161021131720.png

CSS3 では、ワードラッププロパティを使用して、テキストを強制的に折り返すことができます - たとえそれが改行を意味するとしても単語は次のように分割され、次の行に包まれます。 punctuation は、句読點文字がワイヤーフレームの外側(cè)にあるかどうかを指定します。 3

Punctuation-TRIM は、句読點文字をトリムするかどうかを指定します。 3 QQ截圖20161021131825.png

Text-Align-Last 最終行または必須の記號の前に配置する方法に関する設(shè)定。 3

text-emphasis 要素のテキストに圏點と圏點の前景色を適用します。 3

text-justify は、text-align が「justify」に設(shè)定されている場合に使用される配置方法を指定します。 テキストアウトライン。 テキストオーバーフロー テキストシャドウ用 3

Text-wrap はテキストのテキストを指定します。 3

Word-Bream は、中國、日本、韓國語以外のテキストの交換に関するルールを規(guī)定しています。 3

ワードラップにより、長くて切り離せない単語を分割して次の行に切り替えることができます。 ???????????????????????????????????????????????????????????????????????????????????

學(xué)び続ける
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> h1 { text-shadow: 5px 5px 5px #FF0000; } </style> </head> <body> <h1>文字陰影效果</h1> <p><b>注意:</b> Internet Explorer 9 以及更早版本的瀏覽器不支持 text-shadow屬性.</p> </body> </html>