CSS 文字樣式
CSS文字樣式是相對(duì)於內(nèi)容的樣式修飾。由於在層疊關(guān)係中，內(nèi)容要高於背景。所以文字樣式相對(duì)而言更重要。
CSS控製文字屬性：
#1、設(shè)定文字縮排：text-indent:length(長(zhǎng)度單位)可以負(fù)值
2、文字水平對(duì)齊方式：text-align:left左，center居中，right右
3、空白處理: white-space:nowrap(nowrap強(qiáng)制在一行中顯示，pre換行和空格保留，normal自動(dòng)換行)
4 、大小寫(xiě)控制：text-transform:(capitalize每個(gè)單字的第一個(gè)字母大寫(xiě),uppercase每個(gè)字母都大寫(xiě)，loowercase每個(gè)字母都小寫(xiě)，none正常大?。?/strong>
#5、文字垂直對(duì)齊方式：vertical-align:(sub設(shè)定文字為下標(biāo)，super設(shè)定文字為上標(biāo)， top與頂端對(duì)齊，text-bottom與低階對(duì)齊)
6、文字顏色：color設(shè)定文字的顏色
首行縮排
定義：首行縮排是將段落的第一行縮排，這是常用的文字格式化效果。一般地，中文寫(xiě)作時(shí)開(kāi)頭空兩格，類(lèi)似此。
[注意]此屬性可以為負(fù)值
text-indent ??
? ? ? ?值: <length> | < ;percentage> | inherit
初始值: 0
應(yīng)用於: 區(qū)塊級(jí)元素(包括block和inline-block)
繼承性: 有
百分?jǐn)?shù): 相對(duì)於包含區(qū)塊的寬度
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<style>
p {text-indent:50px;}
</style>
</head>
<body>
<p>亞冠聯(lián)賽是亞洲最高等級(jí)的俱樂(lè)部賽事，相當(dāng)于歐洲的歐洲冠軍聯(lián)賽及南美洲的南美解放者杯，高于亞足聯(lián)杯和亞足聯(lián)主席杯，
獲得冠軍的球隊(duì)將代表亞洲參加當(dāng)年12月舉行的國(guó)際足聯(lián)世界俱樂(lè)部杯。期待恒大在世俱杯中為中國(guó)足球爭(zhēng)光添彩。</p>
</body>
</html>水平對(duì)齊
############################################################################################################################### #定義：###水平對(duì)齊是影響一個(gè)元素中的文字的水平對(duì)齊方式。 ############text-align######### 值: left | center | right | justify | inherit###
初始值: left
應(yīng)用於: 區(qū)塊級(jí)元素(包括block和inline-block)
繼承性: 有
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>格式</title>
<style>
.center
{
margin:auto;
width:70%;
background-color:#b0e0e6;
}
</style>
</head>
<body>
<div class="center">
<p>亞冠聯(lián)賽是亞洲最高等級(jí)的俱樂(lè)部賽事，相當(dāng)于歐洲的歐洲冠軍聯(lián)賽及南美洲的南美解放者杯，高于亞足聯(lián)杯和亞足聯(lián)主席杯，</p>
<p>獲得冠軍的球隊(duì)將代表亞洲參加當(dāng)年12月舉行的國(guó)際足聯(lián)世界俱樂(lè)部杯。期待恒大在世俱杯中為中國(guó)足球爭(zhēng)光添彩。</p>
</div>
</body>
</html>文字轉(zhuǎn)換
#文字轉(zhuǎn)換用來(lái)處理英文的大小寫(xiě)轉(zhuǎn)換
text-transform
值: uppercase(全大寫(xiě)) | lowercase(全小寫(xiě)) | capitalize(首字母大寫(xiě)) | none | inherit
初始值: none
應(yīng)用於: 所有元素
繼承性: 有
#<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>轉(zhuǎn)換</title>
<style>
p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}
</style>
</head>
<body>
<p class="uppercase">hello css</p>
<p class="lowercase">hello css</p>
<p class="capitalize">hello css</p>
</html>文字修飾
定義：文字修飾用於提供文字修飾線
[注意]文字修飾線的色彩與文字色彩相同
text-decoration
值: none | [underline(底線) || overline(上劃線) || line-through(中劃線)] | inherit
初始值: none
套用於: 所有元素
繼承性: 無(wú)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文本修飾</title>
<style>
h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}
</style>
</head>
<body>
<h1>這是用來(lái)進(jìn)行文本修飾的</h1>
<h2>這是用來(lái)進(jìn)行文本修飾的</h2>
<h3>這是用來(lái)進(jìn)行文本修飾的</h3>
</body>
</html>
