1.font-family
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>选择器</title>
<style type="text/css">
h1{font-family: "Times New Roman";}
p {font-family: "微软雅黑","宋体","黑体";}
</style>
<!-- font-family字体属性 定义元素内文字以什么字体来显示 可以是具体字体名也可以是字体集-->
<!-- 含空格字体名和中文,用英文引号(")包裹 -->
<!-- 多个字体用逗号隔开,会根据系统有的字体,从左到右进行选择 -->
<!-- 字体集 : -->
</head>
<body>
<h1> 设置字体样式</h1>
<p>设置字体样式测试</p>
<h2 style="font-family: '黑体';">直接设置样式</h2>
<!-- 引号嵌套,外使用双引号,内部使用单引号 -->
</body>
</html>
2.font-size
定义元素内文字大小
使用方式 font-size:绝对单位|相对单位
不设置字体大小时,为浏览器默认字体大小。
绝对单位
不能随浏览器分辨率或父元素大小改变而改变
相对单位
随分辨率改变而改变
单位有:px em %
color
方式 | 写法 | 说明 |
---|---|---|
具体颜色名称 | h1{color:red} | 使用具体颜色 |
rgb | h1 {color:rgb(10%,10%,100%)} | 数字:0~255 百分比0%~100% |
16进制 | h1{color:#008800} | #号开头,0~F 不区分大小写,#008800和#080一致,会自动补充 |
font-weight字体加粗
html加粗:用<b></b>或者<strong></strong>
font-weight:normal,bold(加粗),bolder,lighter(细),100~900
默认值:normal
400等于normal,700等于bold
斜体 font-style
html斜体<em></em>或者<i></i>
font-style:normal ,italic(斜体),oblique(倾斜)
字体变形 font-variant 作用于英文
将小写字母转换为小型大写字母
font-variant:normal,small-caps
<p style="font-variant">Cascading Style Sheets<p/>
效果