CSS字体

字形

1.通用字体系列 - 拥有相似外观的字体系统组合(如 "Serif" 或 "Monospace")
2.特定字体系列 - 一个特定的字体系列(如 "Times" 或 "Courier")
Serif : Times New Roman
Georgia Serif 字体中字符在行的末端拥有额外的装饰
Sans-serif: Arial
Verdana "Sans" 是指无 - 这些字体在末端没有额外的装饰
Monospace: Courier New
Lucida Console 所有的等宽字符具有相同的宽度

字体系列

font-family 属性应该设置几个字体名称作为一种"后备"机制,如果浏览器不支持第一种字体,他将尝试下一种字体。
注意: 如果字体系列的名称超过一个字,它必须用引号,如Font Family:"宋体"。
常用字体组合
p.serif{font-family:"Times New Roman",Times,serif;}
p.sansserif{font-family:Arial,Helvetica,sans-serif;}等

字体样式

主要是用于指定斜体文字的字体样式属性。
这个属性有三个值:
正常 - 正常显示文本
斜体 - 以斜体字显示的文字
倾斜的文字 - 文字向一边倾斜(和斜体非常类似,但不太支持)
p.normal {font-style:normal;}
p.italic {font-style:italic;}
p.oblique {font-style:oblique;}

字体大小

绝对大小:

  • 设置一个指定大小的文本
  • 不允许用户在所有浏览器中改变文本大小
  • 确定了输出的物理尺寸时绝对大小很有用
    相对大小:
  • 相对于周围的元素来设置大小
  • 允许用户在浏览器中改变文字大小

如果你不指定一个字体的大小,默认大小和普通文本段落一样,是16像素(16px=1em)。
设置字体大小像素
设置文字的大小与像素,让您完全控制文字大小。
使用百分比和EM组合

字体加粗

p.normal {font-weight:normal;}
p.light {font-weight:lighter;}
p.thick {font-weight:bold;}
p.thicker {font-weight:900;}

字体转换

p.small {font-variant:small-caps;}

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 字体系列 运行图片 字体风格 运行图片 字体加粗 运行图片 字体大小 正常展示
    Lv_0阅读 1,810评论 0 1
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 4,736评论 0 1
  • 字体body{font-family:Verdana,Geneva,Arial,sans-serif}每个字体系列...
    Holase阅读 2,144评论 0 1
  • 一、字体的一些属性及定义 例子: 二、字体系列 font-family指定字体系列 一组候选字体: Verdana...
    April_17阅读 5,839评论 0 1
  • 其实字体我们都会觉得它是一个小case,但是看了字体的详细文档,发现其实有些东西一直被我们忽略了,记录一些干货。 ...
    xilong阅读 7,229评论 0 1

友情链接更多精彩内容