文字類屬性:
7.水平對齊方式 text-align對塊元素進行標記。
justify對內容以兩端邊界線對齊顯示
8.垂直對齊方式
9.行高
說明:
1)當單行文字的行高等於容器高時,可實現單行文字在容器中垂直方向居中對齊;
2) 當單行文字的行高小於容器高時,可實現單行文字在容器中垂直中齊以上任意位置的定位;
3) 當單行文字的行高大於容器高時,可實現單行文字在容器中垂直中齊以下任意位置的定位。
10.文字修飾:
text-decoration:none/underline/overline/line-through/blink.(高版本瀏覽器不支援blink屬性)
說明:
none:沒有修飾
underline:新增下劃線
overline:新增上劃線
line-through:新增刪除線
blink:閃爍
11.首行縮排:text-indent:數值;
設定第一行的縮排值,負值是向前進(可以直接設定長度,或設定百分比)
說明:
1)text-indent可以取負值,可實現隱藏文字,懸掛縮排。
2)text-indent屬性只對第一行起作用,若第一行不是文字則沒變化。
12.字元間距 控制英文本母和漢字的字距
13.詞間距 控制英文單詞詞距。(通用於英文詞和詞之間的間距)
14.文字流控制(只支援ie瀏覽器)
15.控制文字大小寫
text-transform: none(預設值)/capitalize(每個單詞首字母大寫)/uppercase (都為大寫字母)/lowercase ( 都為小寫字母 )
16.文字陰影 text-shadow
例:text-shadow: 5px 5px 5px #ff0000;
分別表示:水平偏移值,垂直偏移值,模糊的半徑,陰影的顏色)
列表類屬性:
1、定義列表符號樣式:
list-style-type:disc(實心圓)/circle(空心圓)/square(實心方塊)/none(去掉列表符號);
2、使用作為列表符號:
list-style-image:url(所使用的路徑及全稱);
3、定義列表符號的位置:
list-style-position:outside(外邊)/inside(裡邊);
list-style:none;去掉列表樣式;
邊框屬性:
綜合設定: border:3px red solid;
邊框: border:粗細(數值+單位) 顏色 線型(solid/dashed/dotted/double)solid:實線,dashed:虛線,dotted:點狀線,double:雙線;
右邊框:border-right:粗細(數值+單位) 顏色 線型(solid/dashed/dotted/double);
左邊框:border-left:粗細(數值+單位) 顏色 線型(solid/dashed/dotted/double);
上邊框:border-top:粗細(數值+單位) 顏色 線型(solid/dashed/dotted/double);
下邊框:border-bottom:粗細(數值+單位) 顏色 線型(solid/dashed/dotted/double);
背景屬性:
1.背景顏色
語法:選擇符
簡寫:background:color值;
2.背景的設定
語法:background-image:url(背景的路徑及全稱);
說明:
網頁上有兩種形式:插入、背景圖;
插入:屬於網頁內容,也就是結構。
背景圖:屬於網頁的表現,背景圖上可以顯示文字、插入、**等。
3.背景平鋪屬性
語法:選擇符
no-repeat:不平鋪repeat:平鋪repeat-x:橫向平鋪repeat-y :縱向平鋪
4.背景圖的固定
語法:選擇符
說明:
fixed 固定,不隨內容一塊滾動;
scroll 隨內容一塊滾動。
5.背景的位置
語法:background-position:值1 值2;
選擇符
水平方向上的對齊方式(left/center/right)或值
垂直方向上的對齊方式(top/center/bottom)或值
說明:
兩個值 :第乙個值表示水平位置的值, 第二個值表示垂直的位置。
當兩個值都是center的時候寫乙個值就可以代表的是水平位置和垂直位置。
向左方向,向上方向都是負值。
6.background-size: 數值/百分比/auto/cover/contain
說明:
數值:設定背景影象的高度和寬度。
第乙個值設定寬度,第二個值設定高度。
如果只設定乙個值,則第二個值會被設定為 「auto」。
百分比:以父元素的百分比來設定背景影象的寬度和高度。
第乙個值設定寬度,第二個值設定高度。
如果只設定乙個值,則第二個值會被設定為 「auto」。
cover:把背景影象擴充套件至足夠大,以使背景影象完全覆蓋背景區域。
背景影象的某些部分也許無法顯示在背景定位區域中。
contain:把背景影象等比擴充套件至最大尺寸,以使其寬度和高度完全適應內容區域,不一定完全覆蓋住背景區域。
7.背景屬性的縮寫語法:
background:屬性值1 屬性值2 屬性值3;
背景縮寫:
background:#背景色 url(背景的路徑及全稱) no-repeat center top;
CSS3 文字效果屬性型別哪些
1,css3 的文字陰影 css3 中,text shadow屬性適用於文字陰影。您指定了水平陰影,垂直陰影,模糊的距離,以及陰影的顏色 2,css3 box shadow屬性 css3 中 css3 box shadow 屬性適用於盒子陰影 例項div 3,css3 text overflow屬性...
css3文字效果
text shadow 在css3中我們可以給單調的文字加上陰影效果,賦予文字美感 text shadow h shadow v shadow blur color h shadow 必須 水平陰影的位置,允許負值 v shadow 必需 垂直陰影的位置,允許負值 blur 可選 模糊的距離 銳化陰...
css3 文字陰影
text shadow 基本語法 textshadow none length none shadow shadow textshadow none color color length 表示由浮點數字和單位識別符號組成的長度值,可為負值,指定陰影的水平延伸距離 color 表示顏色。陰影位於左上角...