深入理解letter-spacing,word-spacing的對比區別


letter-spacing  

lletter-spacing 屬性增加或減少字符間的空白(字符間距)。

該屬性定義了在文本字符框之間插入多少空間。由於字符字形通常比其字符框要窄,指定長度值時,會調整字母之間通常的間隔。因此,normal 就相當於值為 0。

<p style="letter-spacing:10px;"> thisisatest </p> //顯示: t h i s a t e s t <p style="letter-spacing:10px;"> 這是一個測試</p> //顯示:這 是 一 個 測 試

 

word-spacing  

word-spacing 屬性增加或減少單詞間的空白(即字間隔)。

該屬性定義元素中字之間插入多少空白符。針對這個屬性,“字” 定義為由空白符包圍的一個字符串。如果指定為長度值,會調整字之間的通常間隔;所以,normal 就等同於設置為 0。允許指定負長度值,這會讓字之間擠得更緊。

<p style="word-spacing:10px;"> this is a test</p> //顯示: this is a test*/ <p style="word-spacing:10px;">這 是 一 個 測 試 </p> //顯示: 這 是 一 個 測 試

letter-spacing,word-spacing的區別

word-spacing 屬性增加或減少單詞間的空白(即字間隔)。 letter-spacing 屬性增加或減少字符間的空白(字符間距)。word-spacing意思是設置單詞間的間距,如何區別是不是為一個單詞呢,這里我們可以看出 用空格隔開的為一個單詞,所以在執行word-spacing:10px;執行的前后可以發現,執行后空格變得更大了!!

 


免責聲明!

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



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