温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

CSS字体大小如何设置

发布时间:2022-02-22 15:59:16 来源:亿速云 阅读:204 作者:iii 栏目:开发技术

本篇内容主要讲解“CSS字体大小如何设置”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“CSS字体大小如何设置”吧!

font-size 属性

设置字体大小用到的属性是 font-size,font-size 的属性值如下:

  • xx-small、x-small、small、medium、large、x-large、xx-large:这 7 个属性值分别对应 7 个不同的大小,就好比我们买衣服的尺码一样。

  • smaller:设置字体大小比父元素更小一个尺寸。

  • larger:设置字体大小比父元素更大一个尺寸。

  • length:设置固定的值。

  • %:将字体设置为基于父元素的一个百分比。

  • inherit:继承父元素的字体大小。

我们来看下具体如何设置字体大小:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>CSS设置字体大小 - 亿速云(yisu.com)</title>
	<style type="text/css">
		#xx-small{
			font-size: xx-small;
		}
		#x-small{
			font-size: x-small;
		}
		#small{
			font-size: small;
		}
		#medium{
			font-size: medium;
		}
		#large{
			font-size: large;
		}
		#x-large{
			font-size: x-large;
		}
		#xx-large{
			font-size: xx-large;
		}
		#length{
			font-size: 15px;
		}
	</style>
</head>
<body>
	<p id="xx-small">这段文字的字体大小为xx-small</p>
	<p id="x-small">这段文字的字体大小为x-small</p>
	<p id="small">这段文字的字体大小为small</p>
	<p id="medium">这段文字的字体大小为medium</p>
	<p id="large">这段文字的字体大小为large</p>
	<p id="x-large">这段文字的字体大小为x-large</p>
	<p id="xx-large">这段文字的字体大小为xx-large</p>
	<p id="length">这段文字的字体大小为15px</p>
</body>
</html>

到此,相信大家对“CSS字体大小如何设置”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css
AI