CSS字体属性(font-family、font-size、font-weight、font-style)

心已赠人 2022-12-16 13:24 336阅读 0赞

CSS字体属性

CSS Fonts（字体）属性用于定义字体系列、大小、粗细和文字样式。

字体系列

CSS使用font-family属性定义文本的字体系列。

  1. p { font-family:"微软雅黑";}
  2. div {font-family:Arial,"Microsoft Yahei","微软雅黑";}

各种字体间用英文英文状态下的逗号隔开。如果是用空格隔开的多个单词组成的字体，需要加引号。尽量使用系统自带的字体，保证在任何用户的浏览器中都能够正常显示。首先显示第一种字体，电脑没有第一种字体会显示第二种字体，以此类推，如果都没有则显示默认字体。

字体大小

CSS使用font-size属性定义字体大小。

  1. p {
  2.     font-size: 20px;
  3. }

px:像素，是网页中最常用的单位，谷歌浏览器的字体默认显示为16px，不同的浏览器默认字体大小可能不同。可以给标签设置字体大小。

标题标签比较特殊，需要单独设置大小

字体粗细

CSS使用font-weight属性设置文本字体的粗细。

  1. p {
  2.     font-weight:700;
  3. }

数值之后没有单位！也可以用属性值表示：normal（默认值；400）bold（粗体；700）

字体样式

CSS使用font-style属性设置文本的风格。

  1. p {
  2.     font-style:normal;
  3. }

















属性值 作用
normal 默认值，浏览器会显示标准的字体样式
italic 浏览器会显示斜体的字体样式

在实际应用中很少使用到斜体，反而要给斜体标签（em，i）改为不倾斜标签。

字体复合属性

  1. p{
  2.     /* font:font-style font-weight font-size/line-height font-family; */
  3.     font: italic 700 16px 'Microsoft yahei'
  4. }

通过一行代码改变字体的样式，粗细，大小和系列；注意在使用的时候顺序不能颠倒，并且各个属性之间用空格隔开。

不需要设置的属性可以省略，但是必须保留font-size和font-family属性，否则font属性整体不起作用。

发表评论

表情：
评论列表 （有 0 条评论，336人围观）

还没有评论，来说两句吧...

相关阅读

    相关 CSS字体样式属性

    font-size:字号大小 font-size属性用于设置字号，该属性的值可以使用相对长度单位，也可以使用绝对长度单位。其中，相对长度单位比较常用，推荐使用像素单位px，绝

    今天药忘吃喽~今天药忘吃喽~/ 0 赞/ 559 阅读