CSS个人学习笔记（day 2）_font属性值的书写顺序为,,,,,。(2)

最新推荐文章于 2024-08-02 20:41:30 发布

2401_84976733

最新推荐文章于 2024-08-02 20:41:30 发布

阅读量317

点赞数 4

分类专栏：程序员文章标签： c语言 c++ 学习

本文链接：https://blog.csdn.net/2401_84976733/article/details/138895863

版权

程序员专栏收录该内容

39 篇文章 0 订阅

订阅专栏

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上C C++开发知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以戳这里获取

3.1.3 字体样式- 字体倾斜

属性名：font-style

取值：

1. 正常(默认值)：normal

2. 倾斜：italic

<title>Document</title>
    <style>
        div {
            /* 倾斜效果 */
            font-style: italic;
        }

        em {
            /* 正常的，不倾斜 */
            font-style: normal;
        }
    </style>
</head>

<body>
    <div>div文字</div>
    <em>em</em>
</body>

3.1.4 字体样式- 字体系列

属性名： font-family

**常见取值：**具体字体1、具体字体2…字体系列

1. 具体字体：“Microsoft YaHei”、微软雅黑、黑体、宋体、楷体等…

2. 字体系列：sans-self、serif、monospace等…

**渲染规则：**1. 从左往右按顺序查找，如果电脑中未安装字体，则显示下一个字体

2. 如果都不支持，此时会根据操作系统,显示最后字体系列的默认字体

   系统       默认字体
 windows     微软雅黑
  macOS        苹方

注意点：

如果字体名称中存在多个单词,推荐使用引号包裹
最后一项字体系列不需要引号包裹
网页开发时,尽量使用系统常见自带字体,保证不同用户浏览器网页都可以正确显示

3.1.5 字体样式- 常见字体系列（了解）

无衬线字体 (sans-serif)

**1. 特点：**文字笔画粗细均匀,并且首尾无装饰

**2. 场景：**网页中大多采用无衬线字体

**3. 常见该系列字体：**黑体、Arial

衬线字体 (serif)

**1. 特点：**文字笔画粗细不均，并且首尾有笔锋装饰

2. 场景： 报刊书籍中应用广泛

**3. 常见该系列字体：**宋体、Times New Roman

等宽实体 (monospace)

1. 特点： 每个字母或文字的宽度相等

**2. 场景：**一般用于程序代码缩写，有利于代码的阅读和缩写

3. 常见系列字体： Consolas、fira code

3.1.6 字体样式- 层叠性

**样式层叠性：**如果给同一个标签设置了相同的属性，此时样式层叠(覆盖)，写在最下面的会生效

**CSS层叠样式表：**所谓的层叠及叠加的意思，表示样式可以一层一层的层叠覆盖

<title>Document</title>
    <style>
        p {
            color: red;
            color: blue;
        }
    </style>
</head>
<body>
    <!-- 层叠性:后面的覆盖前面的属性 -->
    <!-- 覆盖 -->
    <p>ppppp</p>
</body>

3.1.7 字体样式- font连写

属性名：font(复合属性)

**取值：**font: style weight size family;

<style>
 p { 
     /* 一个属性冒号后面书写多个值的写法 -- 复合属性 */
     /* font: style  weight  size  字体 */
        font: italic 700 66px 宋体;
        font-style: normal;
  }
</style>

省略要求： 只能省略前两个属性，如果省略了相当于设置了默认值

**注意点：**如果需要同时设置单独和连写的属性形式

要么把单独的样式写在连写的下面
要么把单独的样式写在连写的里面
font属性的书写必须按照顺序
font-size和font-family的值是必需的。

 p {
      /* 要么把单独的样式写在连写的下面 */
         font: italic 700 66px 宋体;
         font-style: normal;    
      /* 省略要求: 只能省略前两个属性，如果省略了相当于设置了默认值 */
         font: 100px 微软雅黑;
  }

**font属性的书写顺序：**1. 字体风格(font-style)

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上C C++开发知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以戳这里获取

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上C C++开发知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以戳这里获取

2401_84976733

关注

4
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
CSS个人学习笔记（day 2）_font属性值的书写顺序为,____,____,____,____,____。(2)

*样式层叠性：**如果给同一个标签设置了相同的属性，此时样式层叠(覆盖)，写在最下面的会生效。**渲染规则：**1. 从左往右按顺序查找，如果电脑中未安装字体，则显示下一个字体。**CSS层叠样式表：**所谓的层叠及叠加的意思，表示样式可以一层一层的层叠覆盖。**font属性的书写顺序：**1. 字体风格(font-style)**3. 常见该系列字体：**宋体、Times New Roman。**常见取值：**具体字体1、具体字体2…**3. 常见该系列字体：**黑体、Arial。
复制链接

扫一扫