HTML+CSS之文字段落排版


一、文字排版——字體

Eg:

body{font-family:"宋體";}

body{font-family:"Microsoft Yahei";}//微軟雅黑

注:

不要設置不常用的字體,如果用戶本地電腦上沒有安裝所設置的字體,就會顯示瀏覽器默認的字體。

 

二、文字排版——字號、顏色

Eg:

設置網頁文字字號12像素,字體顏色設置為#666(灰色):

body{

font-size:12px;

color:#666;

}

 

三、文字排版——粗體

Eg:

p span{font-weight:bold;}

 

四、文字排版——斜體

Eg:

p a{font-style:italic;}

 

五、文字排版——下划線

Eg:

p a{text-decoration:underline;}

 

六、文字排版——刪除線

七、段落排版——縮進

中文文字段前空兩個文字的空白。

2em的意思就是文字的2倍大小。

八、段落排版——行間距(行高)

Eg:

p{line-height:1.5em;}

 

九、段落排版——中文字間距、字母間距

如果想在網頁排版中設置文字間隔或者字母間隔就可以使用letter-spacing來實現。

Eg:

h1{

  letter-spacing:50px;

}

 注:這個樣式使用在英文單詞時,是設置字母與字母之間的間距。

單詞間距設置(word-spacing):

Eg:

h1{

  word-spacing:50px;

}

 

十、段落排版——對齊

為塊元素中的文本、圖片設置居中樣式等,可以使用text-align

居中

h1{

  text-align:center;

}

居左

h1{

  text-align:left;

}

居右

h1{

  text-align:right;

}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM