CSS3 文本效果

CSS3 文本效果

CSS3 文本效果

CSS3中包含幾個(gè)新的文本特征。

在本章中您將了解以下文本屬性：

• text-shadow
• word-wrap

瀏覽器支持

Internet Explorer 10, Firefox,Chrome, Safari, 和 Opera支持text-shadow 屬性。

所有的主流瀏覽器支持自動(dòng)換行（word-wrap）屬性。

注意： Internet Explorer 9及更早IE版本不支持 text-shadow 屬性.

CSS3的文本陰影

CSS3中，text-shadow屬性適用于文本陰影。

您指定了水平陰影，垂直陰影，模糊的距離，以及陰影的顏色：

實(shí)例

給標(biāo)題添加陰影:

h1
{
text-shadow: 5px 5px 5px #FF0000;
}

嘗試一下 ?

CSS3的換行

如果某個(gè)單詞太長，不適合在一個(gè)區(qū)域內(nèi)，它擴(kuò)展到外面：

This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.

CSS3中，自動(dòng)換行屬性允許您強(qiáng)制文本換行 - 即使這意味著分裂它中間的一個(gè)字：

This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.

CSS代碼如下：

實(shí)例

允許長文本換行:

p {word-wrap:break-word;}

嘗試一下 ?

New Text Properties