css文字控制與css文本樣式示例和屬性

發(fā)布時間：2014-04-16 14:54:33 作者：佚名

這篇文章主要介紹了css文字控制與css文本樣式示例和屬性,需要的朋友可以參考下

一、CSS控制文字屬性：

1、font-size:18px;:設(shè)置字號
2、color:#093:設(shè)置字色
3、font-family:'宋體';:設(shè)置字體（可以有多種字體，兩個字體之間有,分隔開，表示如果系統(tǒng)中有第一個字體則顯示效果是第一個字體，如果沒有則顯示的是第二個字體的效果，以此類推）
4、line-height:150%;:設(shè)置行與行之間的距離(單位可用px或者em或者百分比)
5、font-weight:bold:設(shè)置字體的粗細（粗：bold 正常：normal）

6、font-variant : normal正常 | small-caps小型的大寫字母字體
7、font—style:設(shè)置字體樣式(normal正常，italic,oblique斜體)
8、text-decoration:修飾文字(none正常，underline下劃線，overline上劃線，line-through刪除線 blink閃爍（只支持IE6,7,搜狐）)
9、letter-spacing:5px:字符間距（normal默認，length長度單位）
10、word-spacing:5px:單詞間距(normal默認，length長度單位

font屬性簡化的寫法：是否斜體是否同寬是否粗體大小字體

復(fù)制代碼

代碼如下:

二、CSS控制文本屬性：

1、設(shè)置文本縮進：text-indent:length(長度單位)可以負值
2、文本水平對齊方式：text-align:left左，center居中，right右
3、空白處理:white-space:nowrap(nowrap強制在一行中顯示，pre換行和空格保留，normal自動換行)
4、大小寫控制：text-transform:(capitalize每個單詞的第一個字母大寫,uppercase每個字母都大寫，loowercase每個字母都小寫，none正常大?。?br />5、文本垂直對齊方式：vertical-align:(sub設(shè)置文本為下標，super設(shè)置文本為上標， top與頂端對齊，text-bottom與低端對齊)

復(fù)制代碼

代碼如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a >
<html xmlns="<a >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS控制文本</title>
</head>
<style type="text/css">
#one{text-indent:2em;}
#two{text-align:center; white-space:pre; text-transform:uppercase;}
span{vertical-align:super;}
#t2{width:100px; vertical-align:middle;}
</style>
<body>
<p id="one">0.5秒三分絕殺!波特蘭上演波什時刻第N次拯救熱火</p>
<h1 id="two">玩命暴扣扳平+助攻絕殺三分 <span>熱火</span>太幸運有這fkasfjklas fklasdj顆隊魂</h1>
<p>熱火今夜還一功臣必須贊 11分不多但卻分分是金!</p>
<p>詹波為小弟惡犯叫屈當(dāng)事人他都起飛了!肯定假摔</p>
<p>斯帥稱客戰(zhàn)開拓者奧登不打波什：他很快就可復(fù)出</p>
<p>
<img src="../../imgs/95160924ab18972ba7fd1de8e7cd7b899f510ac8.jpg" id="t2"/>
斯帥稱客戰(zhàn)開拓者奧登不打波什：他很快就可復(fù)出
</p>
</body>
</html>