HTML與CSS之文字文本

一.文字(font)

1.font-weight 文字著重

  bold      加粗
  normal    正常 

例如font-weight: bold;

2.font-style 文字傾斜

  italic    傾斜
  normal    正常  

例如: font-style: italic

3.font-size 文字大小(一般為偶數(shù))

  50px      數(shù)字加單位
  默認(rèn)字體大小為16px

例如:font-size: 50px;

4.font-family 字體(中文默認(rèn)為宋體)

   格式:英文字體,"中文字體"http://英文字符使用英文字體,中文字符使用中文字體

例如:font-family: charcoal,"楷體";

5.line-height 文字行高

行高代表一行文字在容器中所占的高度

如果行高的值與容器相等,那么文字就會(huì)豎直垂直居中

ps:測量多行文字的行高的方法:

        1.首先要知道文字的大小
        2.用ps測量兩行文字之間的距離
        3.拿上面測量出來的距離除以2
        如果行高為奇數(shù),文字的上邊距少一像素,下邊距多一像素

6.文字的復(fù)合樣式:

格式:
font:font-weight font-style font-size(必需)/font-weight font-family(必需)
順序不能亂
例如:
font: bold italic 26px/50px "微軟雅黑";
font: 26px "微軟雅黑";

二.文本(text)

1.color 顏色

值為幾種顏色的表示方式

2.text-align 文本對(duì)齊方式

  left   左對(duì)齊(默認(rèn))
  center 居中對(duì)齊
  right   右對(duì)齊     

3.text-indent 首行縮進(jìn)(em縮進(jìn)字符)

  12px  縮進(jìn)12像素
  1em   空出1個(gè)字符
  2em   空出2個(gè)字符
  em根據(jù)字體大小來計(jì)算的,字體不管怎么變1個(gè)em始終縮進(jìn)一個(gè)字體大小

4.text-decoration 文本修飾

  underline     下劃線
  overline      上劃線
  line-through  中劃線
  none           無    

5.letter-spacing 字母間距

  10px    數(shù)字加單位

6.word-spacing 單詞的間距(以空格間距)

  10px   數(shù)字加單位(文本中的字需要用空格隔開)

7.white-space 強(qiáng)制不換行

  nowrap   不換行
  normal    換行
  英文與數(shù)字如果沒有結(jié)束的話是不會(huì)換行的

8.word-break 詞內(nèi)換行

  break-word   讓單詞換行
  break-all    所有都不換行
  normal       正常

ps:空格有多大?

在宋體下,空格的大小是一個(gè)字體大小的一半,默認(rèn)為8px
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容