靈活XHTML和CSS網頁設計1-字型大小方案

來源:互聯網
上載者:User
文章目錄
  • 先瞭解下各個字型單位:
  • 基準尺寸加百分比模型
  • 利用基準尺寸+百分比的好處?

 

先瞭解下各個字型單位:

相對單位:px相對於裝置螢幕的解析度;em相對於父元素;ex相對於字母x的高度

絕對單位:in英寸;pt點距;pc picas;cm厘米;mm毫米

絕對單位太絕對了,放棄~

px是主流,但是ie支援不好。。在IE裡利用“查看”=》“字型大小”切換大小沒反應。

ex太冷了點。。

em還行吧。

 

基準尺寸加百分比模型

 

字型大小的控制,除利用數字和單位外,還有關鍵字如small,large等可用。本文要介紹的方案即“基於關鍵字做為基準尺寸,利用百分比調和”來控制字型大小。簡稱“基準尺寸加百分比模型(base-plus-percentage)”。

首先,為body標籤設定基準字型大小。如用關鍵字small

其次,其他元素相對於父級元素,利用百分比控制自身字型大小。

 

如:

body{font-size:small;}

h1 { font-size: 150%; }

h2 { font-size: 130%; }

h3 { font-size: 120%; }

ul li { font-size: 90%; }

 

利用基準尺寸+百分比的好處?

沒有px在IE裡面的毛病…

改了基準尺寸後,別的字型也相應一起改變。

 

今兒在讀《New.Riders.Press.Bulletproof.Web.Design.Jul.2005》,整理整理~讀書不整理和吃完後就拉有區別嗎??

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.