私密笔记

  • 01.1字体颜色
  • 01.2字体大小
  • 01.3字体粗细
  • 01.4字体样式
  • 01.5字体系列
  • 01.6字体属性综合写法
  • 首页
  • 友情链接
  • 文章归档
  • 读者排行
  • 朋友圈
  • 订阅
  • https://simibiji.com/feed

01-CSS:CSS字体属性

  • captain
  • 2024-03-11
  • 0

CSS字体属性可以定义字体、颜色、大小、文字样式。

01.1字体颜色

CSS使用color属性定义字体颜色。
实例语法:

body {
color: red;
}

这是表明在body中所有的字体颜色,这里定的都为red,color对应字体的颜色值有四类:

body { color: red;}/直接定义颜色/
body { color: #ff0000;} /十六进制/
body { color: rgb(255,0,0);}/RGB/
body { color: rgba(255,0,0,0.7);}/rgba*/

01.2字体大小

CSS使用font-size属性定义字体大小。
实例语法:

body {
font-size: 20px;
}

属性值中,20是大小,px是像素单位。数字越大字体越大,一般浏览器有默认值,比如Chrome默认是20px。

01.3字体粗细

CSS使用font-weight属性定义文本字体的粗细。
实例语法:

body {
    font-weight: bold;
}

属性值有3个
normal 是默认值;
bold 加粗;
100-900以数字代表加粗程度,400=normal,700=bold。

01.4字体样式

CSS使用font-style属性定义字体样式。
实例语法:

body {
    font-style: normal; 
}

属性值有2个。
normal默认值,浏览器显示默认的字体样式;
italic浏览器会显示斜体的字体样式。

01.5字体系列

CSS使用font-family指定元素或字体系列,指定用什么字体。
实例语法:

body {
font-family: "Microsoft YaHei","Simsun","SimHei";
}

属性值是各类字体名称,这里的第一个是微软雅黑,如果第一个不存在,就顺位用第二个字体,每个字体之间用逗号分开。

01.6字体属性综合写法

CSS使用`font`来字体属性定义字体的综合写法。

body { font: font-style font-weight font-size/line-height font-family; }
实例语法:

body {
font:italic 30px "Microsoft YaHei"
}

使用 font 属性时,必须按上面语法格式中的顺序书写,不能更换顺序,并且各个属性间以空格隔开 不需要设置的属性可以省略(取默认值),但必须保留 font-size 和 font-family 属性,否则 font 属性将不起作用

© 2025 私密笔记
Theme by Wing
  • {{ item.name }}
  • {{ item.name }}