字体大小
属性名:front-size
取值:数字+px
注意点:谷歌浏览器的默认值是16px,单位需要设置,否则是无效的。
<style>
p{
font-size: 30px;
}
</style>
</head>
<body>
<p>今天也要加油啊!!!</p>
</body>
字体粗细
属性名:font-weight
关键字取值:
正常 | normal |
加粗 | bold |
纯数字取值:100~900的整百数
正常 | 400 |
加粗 | 700 |
注:不是所有字体都提供了9种粗细,因此部分取值页面中无变化
在实际开发中,以正常,加粗两种取值使用的最多。
<style>
p{
font-weight: bold;
}
.weight{
font-size: 700;
}
</style>
</head>
<body>
<p>今天也要加油啊!!!</p>
<p class="weight">加油!</p>
</body>
字体样式
属性名:font-style
取值:
正常(默认值):normal
倾斜:italic
<style>
#style{
font-style: italic;
}
</style>
</head>
<body>
<p id="style">加油</p>
</body>
字体样式的连写
属性名:font
取值:font:style,weight,size,family
顺序要求:可以是swsf
省略要求:只能省略前面两个,如果省略相当于设置了默认值
注意点:
如果需要同时设置单独和连写的形式
要么把单独的样式写在连写的后面
要么把单独的样式写在连写的里面(否则就相当于给同一个标签设置了两个相同属性。导致前面的被覆盖掉,所以写在后面。)
<style>
p{
font: italic 700 300px 楷体,宋体,隶书,sans-serif;
}
</style>
</head>
<body>
<p>即使放假也不能忘记学习</p>
</body>