css字体属性

最新推荐文章于 2024-04-22 13:50:02 发布

gzxcghzxysjnc7

最新推荐文章于 2024-04-22 13:50:02 发布

阅读量48

点赞数

分类专栏：日记笔记文章标签： css html 前端

本文链接：https://blog.csdn.net/2202_75660142/article/details/129031555

版权

日记同时被 2 个专栏收录

8 篇文章 0 订阅

订阅专栏

笔记

8 篇文章 0 订阅

订阅专栏

文章详细介绍了CSS中设置字体样式的属性，包括font-style、font-weight用于定义字体倾斜和粗细，font-size定义字号，以及如何使用font-family选择字体，并通过示例展示了字体连写的语法。此外，还提供了HTML代码段进行实践应用。

摘要由CSDN通过智能技术生成

一共有五类按顺序分别为:字体样式字体粗细字号字体字体连写

字体样式:font-style 倾斜为italic 不倾斜为normal

字体粗细:font-weight 正常值为400 又可以用normal表示; 加粗为700 又可以用bold表示,一般多用数字表示 100-900的数字范围表示数字后不加单位.

字号:font-size px(像素)是单位一般谷歌的标准字体大小为16px <body>可以用来指下面的一块整体的字号大小

字体:font-family 选择合适的字体若字体名称之间有空格,要用引号(双引号单引号都可以) 写多个字体时字体间要用逗号(英文状态下)隔开(按顺序启用若第一个字体没的话就用第二个都没的话就系统默认)

字体连写(复合):font:样式粗细字号字体必须按顺序写才有效其他可以不写但复合状态下字号和字体必须写

练习:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>css字体属性</title>
    <style>
        p,div
         {color :blueviolet ;font-size: 100px ;font-family:'Times New Roman', Times, serif ;font-weight:400}
         ol
         {color :brown ;font-family: '微软雅黑'}
        ul
        {font: italic  400 100px "microsoft yahei"}
    </style>
</head>
<body>
    <p>圣诞老人</p>
    <div>新年快乐</div>
    <ol>
        <li>新</li>
        <li>年</li>
        <li>快</li>
    </ol>
    <ul>
        <li>黑</li>
        <li>白</li>
        <li>灰</li>
    </ul>
</body>
</html>