31.html的行高(line height)和字体的简写属性等等

最新推荐文章于 2022-11-18 18:34:03 发布

Keeling1720

最新推荐文章于 2022-11-18 18:34:03 发布

阅读量3.5k

点赞数

分类专栏： HTML5+CSS

本文链接：https://blog.csdn.net/weixin_44741023/article/details/116204902

版权

HTML5+CSS 专栏收录该内容

41 篇文章 5 订阅

订阅专栏

文章目录

html的行高和字体属性等等
- line height
- 字体的简写属性

html的行高和字体属性等等

line height

1.行高（line height）指的是文字占有的实际高度。可以通过line-height来设置行高，行高也可以指定一个大小（px，em或整数），如果是整数，那么行高就是字体的指定的倍数。
2.设置字体宽就是字体存在的格子，设置font-size就是设置字体的高度。
3.行高在字体框的上下平均分配
4.行高等于父元素的高度，那么单行文字就会垂直居中。
5.行高还经常用来设置文字的行间距（行间距 = 行高 - 字体大小）

字体的简写属性

直接使用font：(bold) (italic) 指定字体大小（font-size）和字体族(font-family)
其中，bold是加粗，italic是斜体。

语法：font:(bold) (italic) 字体大小/行高字体族。

bold属于font-weight的属性值；italic属于font-style的属性值。
你也大可以用

font-weight:bold;<!–设置加粗，他的取值还有100-900（但是一般不会这么用）–>
font-style:italic;<!–设置字体倾斜–>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>字体</title>
    <style>
        div{
            border: 1px solid red;
            /*font-size: 50px;*/
            /*font-family: 楷体, 宋体,serif;*/
            font:50px 楷体, 宋体, serif;
        }
    </style>
</head>
<body>
    <div>窈窕淑女，君子好逑。Nice to meet you.</div>
</body>
</html>

显示：
在这里插入图片描述

Keeling1720

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
31.html的行高(line height)和字体的简写属性等等

文章目录html的行高和字体属性等等line height字体的简写属性html的行高和字体属性等等line height1.行高（line height）指的是文字占有的实际高度。可以通过line-height来设置行高，行高也可以指定一个大小（px，em或整数），如果是整数，那么行高就是字体的指定的倍数。2.设置字体宽就是字体存在的格子，设置font-size就是设置字体的高度。3.行高在字体框的上下平均分配4.行高等于父元素的高度，那么单行文字就会垂直居中。5.行高还经常用来设置文字的行
复制链接

扫一扫