CSS3文字效果

2021-10-02 05:30:11 字數 1557 閱讀 2596

text-overflow 屬性規定當文字溢位包含元素時發生的事情。

text-overflow: clip|ellipsis|string;

描述clip

預設值,修剪文字

ellipsis

顯示省略符號來代表被修剪的文字。

string

使用給定的字串來代表被修剪的文字。

text-shadow 屬性向文字設定陰影。

text-shadow: h-shadow v-shadow blur color;
注:text-shadow 屬性向文字新增乙個或多個陰影。該屬性是逗號分隔的陰影列表,每個陰影有兩個或三個長度值和乙個可選的顏色值進行規定。省略的長度是 0。值說明

h-shadow

必需。水平陰影的位置。允許負值。

v-shadow

必需。垂直陰影的位置。允許負值。

blur

可選。模糊的距離。

color

可選。陰影的顏色。

box-shadow: h-shadow v-shadow blur spread color inset;

說明h-shadow

必需。水平陰影的位置。允許負值。

v-shadow

必需。垂直陰影的位置。允許負值。

blur

可選。模糊的距離。

spread

可選。陰影的尺寸。

color

可選。陰影的顏色。請參閱 css 顏色值。

inset

可選。將外部陰影 (outset) 改為內部陰影。

word-break 屬性規定自動換行的處理方法。

word-break: normal|break-all|keep-all;

描述normal

使用瀏覽器預設的換行規則。

break-all

允許在單詞內換行。

keep-all

只能在半形空格或連字元處換行。

word-wrap: normal|break-word;

描述normal

只在允許的斷字點換行(瀏覽器保持預設處理)。

break-word

在長單詞或 url 位址內部進行換行。

white-space屬性指定元素內的空白怎樣處理。值描述

normal

預設。空白會被瀏覽器忽略。

pre空白會被瀏覽器保留。其行為方式類似 html 中的標籤。

nowrap

文字不會換行,文字會在在同一行上繼續,直到遇到

標籤為止。

pre-wrap

保留空白符序列,但是正常地進行換行。

pre-line

合併空白符序列,但是保留換行符。

inherit

規定應該從父元素繼承 white-space 屬性的值。

css3文字效果

text shadow 在css3中我們可以給單調的文字加上陰影效果,賦予文字美感 text shadow h shadow v shadow blur color h shadow 必須 水平陰影的位置,允許負值 v shadow 必需 垂直陰影的位置,允許負值 blur 可選 模糊的距離 銳化陰...

CSS3文字效果

css3提供了text shadow文字陰影效果,這個屬性在之前講過,只是沒有涉及瀏覽器支援情況 opera 9.5 firefox 3.5 chrome 4 ie 10 safari 3.1 正值陰影 負值陰影 多重陰影疊加 css3提供了text overflow屬性來控制文字的溢位部分,它的作...

css3文字效果

1.text shadowcss3中,text shadow是設定文字陰影 水平陰影 垂直陰影 模糊的距離 以及陰影的顏色 給標題新增陰影 h12.text overflowcss3文字溢位屬性指定應向使用者如何顯示溢位內容 div 上面的這串 可以使溢位的文字內容以省略號 顯示 3.css3的換行...