零基础学习WEB前端开发(十七):字体大小、字体粗细和字体样式 您所在的位置:网站首页 stata设置字体大小 零基础学习WEB前端开发(十七):字体大小、字体粗细和字体样式

零基础学习WEB前端开发(十七):字体大小、字体粗细和字体样式

2023-08-16 10:02| 来源: 网络整理| 查看: 265

目    录

一、字体大小

1.1 基本语法

1.2 演示

1.3 注意点

二、字体粗细

2.1 语法

2.2 例子

2.3 注意点

三、字体样式

3.1 语法

3.2 实例演示

一、字体大小 1.1 基本语法

font-size 

1.2 演示 Document /* 标签选择器 */ h5 { font-family: "微软雅黑"; font-size: 30px; } p { font-family: "楷体"; font-size: 20px; } 小诗

生命的树上

雕了一枝花

谢落在我的怀里 ,

轻轻的压在心上。

她接触了心中的音乐

化成小诗一朵。

效果:

1.3 注意点 一般用px(像素)来表示大小不同的浏览器默认的字体的大小是不一样的,因而需要自己设置一个具体的字体大小实际使用的时候一般给body添加字体大小 二、字体粗细 2.1 语法

font-size: 字体粗细参数

 

字体粗细参数:

normal默认值。定义标准的字符。bold定义粗体字符。bolder定义更粗的字符。lighter定义更细的字符。 100200300400500600700800900定义由粗到细的字符。400 等同于 normal,而 700 等同于 bold。 2.2 例子 Document /* 标签选择器 */ h5 { font-family: "微软雅黑"; font-size: 30px; } p { font-family: "楷体"; font-size: 20px; font-weight: bold; } 小诗

生命的树上

雕了一枝花

谢落在我的怀里 ,

轻轻的压在心上。

她接触了心中的音乐

化成小诗一朵。

效果:

 

2.3 注意点

实际开发中,更多地使用数字大小来表示

三、字体样式 3.1 语法

font-style: 属性值;

属性值作用normal默认,显示标准的字体样式italic显示斜体 3.2 实例演示 Document /* 标签选择器 */ h5 { font-family: "微软雅黑"; font-size: 30px; } p { font-family: "楷体"; font-size: 20px; font-weight: bold; font-style: italic; } 小诗

生命的树上

雕了一枝花

谢落在我的怀里 ,

轻轻的压在心上。

她接触了心中的音乐

化成小诗一朵。

效果:

 



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有