多语言展示
当前在线:1237今日阅读:84今日分享:32

CSS文本长度单位的总结与实例分析

网页中对于文字的修饰提供了很多支持,我们可以做到网页中像word一样来显示文字。今天我就来分享下在HTML加上CSS中提供的文字长度单位,虽然有的用不到但是也给我提供了一个方法和支持。
工具/原料
1

CSS基础知识

2

HTML基础知识

方法/步骤
1

文字长度单位in(英寸):一般英国使用的长度单位,1英寸约等于2.51厘米。这里我在浏览器中显示1in的文字效果。具体代码: 文字的长度

这里是文字长度的测试

2

文字的长度单位cm(公分):公分也叫厘米。这里我为了和上面的例子做比较也用2.54厘米来说明问题,具体代码如下: 文字的长度

这里是文字长度的测试

这里是文字长度的测试

通过比较可以看到执行结果完全一样。

3

文字的长度单位mm:这个就是长度单位来表示文字的大小的一个方法。 文字的长度

这里是文字长度的测试

这里是文字长度的测试

通过10mm和1cm比较可以反应出执行结果的问题。

4

文字的长度单位ex:以小写字母的高度为单位来显示的,这个现在很多都不支持了,使用的也很少。 文字的长度

HtmL

5

文字的长度单位em:这个是以字体的高度为单位的一种表示方法,其实就是百分比来显示的。em在CSS中,1em等于100%,是一个比率,结合CSS继承关系使用,具有灵活性。 文字的长度

HtmL

6

文字的长度单位pt:在电脑显示器中是一个标准的长度单位,1pt等于1/72英寸,这个单位常常用于印刷业,非常简单易用的一个单位。 文字的长度

HtmL

HtmL

通过72in个1pt的比较来阐述这个单位,可以直观的反应出他的大小的。

7

文字的长度单位px:像素,屏幕上显示的最小单位,这个常常用于网页设计中非常直观并且方便;示例代码如下 文字的长度

HtmL

通过以上的例子我们学习了文字长度的单位,通过不同单位来描述文字大小需要根据不同的定义来设置其值。

注意事项

设置文字大小的时候需要合适取值

推荐信息