第十五天学习：CSS特性1

标签：

关键字：CSS特性1

晨跑计划：

学习计划：

• 控制字体：
  • font-family特性
  • font-size特性
  • font-weight特性
  • font-style特性
  • font-variant特性
  • font-stretch特性
  • font-size-adjust特性
• 长度：
  • 绝对单位
  • 相对单位
  • 百分比

学习记录：

• 控制字体：
  • 可以采用多种特性来控制文档中文本的外观，可以将这些特性划分为如下两组：
    • 直接影响字体和其外观特性
    • 对文字具有其他格式影响的特性
  • 字体和字型是不同的概念：
    • 字型是字体族，例如Arial字体族
    • 字体是某个字体族的一个特定成员，例如Arial 12-point bold
• font-family特性
  • 用于指定应该使用的字型，这个特性的最大缺陷在于，查看页面的人员必须在其计算机上安装所需的字体，否则不能以该字体看到页面上的文本。但是，可以指定多种字体，如果用户不具有第一种字体，则浏览器将查找列表中的下一种字体。
  • 如果一种字体包含空格，例如times new roman 或courier new，则应当将字体名放置在双引号中
  • 5种通用字体名
    • serif  具有衬线的字体
    • sans-serif  不具有衬线的字体
    • monospace  固定等宽字体
    • cursive  仿效手写字体
    • fantasy  用于标题等的修饰性字体
• font-size特性
  • font-size特性用于指定字体的大小，可以以下几种方式指定这个特性的值：
    • 绝对大小
      • 值：xx-small（最小）、x-small（较小）、small（小）、medium（正常/默认值）、large（大）、x-large（较大）、xx-large（最大）
      • 不允许用户在所有浏览器中改变文本大小（不利于可用性）
      • 绝对大小在确定了输出的物理尺寸时很有用
    • 相对大小（相对于父容器中字体尺寸进行相应调整）
      • 值：smaller、larger   单位：em
      • 允许用户在浏览器改变文本大小
    • 长度
      • 值：px、em、ex、pt、in、cm、pc、mm
    • 百分比（相对于父元素，相对于包含该文本的元素的比例）
      • 2%、10%、25%、50%
• font-weight特性
  • 设置字体的粗细
  • 值：normal（默认值400）、bold（粗体700）、bolder（比正常粗）、lighter（比正常细）、100-900
• font-style特性
  • 常用与规定斜体文本
  • 值：nomer-文本正常显示；italic-文本斜体显示；oblique-文体倾斜显示 
• font-variant特性
  • 设定小型大写字母
  • 值：normal（默认值）-正常的字体，small-caps小型的大写字母字体
• font-stretch特性（CSS2.1以删除）
  • 设置字体中实际字母的宽度（而不是它们之间的空间），它的值可以是相对的或者固定的
  • 值：normal（正常）、wider（宽的）、narrower（窄的）
• font-size-adjust特性（CSS2.1以删除）
  • 可以用于修改字体的字符大小宽高比
  • 当首选字体不可用时，对替换字体进行智能缩放
  • 值：none、number（定义字体的值比率）
• 长度
  • 绝对单位
    • pt：一点（一英寸的1/72，等同于大多数计算机屏幕分辨率中的一个像素）
    • pc：十二点（一英寸的1/12）使用十二度量文本行的长度
    • in：一英寸
    • cm：一厘米
    • mm：一毫米
• 相对单位
  • 随着显示文档所使用的媒体种类的变化，它们可以调整大小
  • 在web浏览器中，用户可以增加或减少字体的大小，并且页面的剩余部分将会缩放以适合当前字体大小
  • px
    • 像素是屏幕上最小的分辨率单位，并且是CSS中指定字体大小和长度的最常用方式
  • em
    • em单位直接对应于参考元素的字体大小，参考元素可以是该元素或包含它的元素
    • 在CSS中，em是非常有用的单位，因为它可以自动适应用户所使用的字体
  • ex
    • ex是小写字母x的高度，因为不同的字体具有不同的比例，所以ex相对于字体的大小及字体的类型
• 百分比
  • 百分比给出相对于另一个值的某个值（具体的值取决于正在讨论的特性）
  • 当一个百分比值被继承时，它是由继承的百分比（而不是百分比本身）设置的值

扩展阅读：

• CSS font-size属性
• CSS长度单位
• 

问题的记录与解决：

• italic和oblique的区别：
  • 可以理解成italic是使用文体的斜体，oblique是让没有斜体属性的文字倾斜
  • 对于没有斜体的字体应该使用oblique属性值来实现倾斜的文字效果

第十五天学习：CSS特性1

标签：

原文地址：http://www.cnblogs.com/zhangguihong/p/5688974.html