CSS排版:行高,垂直,外边距

css设置行高

Last Updated on

CSS行高垂直外边距可以使用水平内边距、边框和外边距调整它们的间距。但是,垂直内边距、边框和外边距不影响行内框的高度。这三个属性是相互依赖的关系,改变行间距离、设置垂直对齐等都需要它们的通力合作。单行文本垂直居中是将高度和行高设置成一样的值,但高度其实是没有必要设置的

排版的可读性主要是垂直间距:
1、标题和段落之间的间距;
2、段落中的行与行之间的间距
3、等等。

这节课将学习如何使用line-height属性,垂直边距控制排版的垂直间距。

1、p>{内容},查看元素;
1、蓝色是内容;
2、橙色就是margin,外部间距;
3、看那个线框图;
4、浏览器默认样式;
1、去除默认样式;
5、margin在排版中非常重要;

6、line-heigh:就是文字每行的高度;
1、都有间距;
2、line-height可以设置跟字的高度一样;
3、line-height:1,就是1乘以这个元素中字母的高度,所以1没有空白了,显得比较难读;
4、1.618,就是5phi,设计师用这个理论很久了;这个数字的间距让人看起来确实舒服。

Last modified: 2019年11月13日

前一篇

CSS学习系列

CSS伪元素: first-letter和first-line的用法

first-letter和first-line的用法:定义元素中的第一个字符或多行元素的第一行,::first-line 伪元素只能在块容器中,所以,::first-line伪元素只能在一个display值为block, inline-block, table-cell 或者 table-caption中有用.

...

后一篇

CSS学习系列

CSS排版:安全字体,自定义字体,字体堆栈

在网页,不是所有的字体会自动显示。这节课学习如何选择“安全字体”,如何使用自定义字体,如果您的首选字体无法成功加载,如何创建“堆栈”的字体。

...