CSS——48. rem单位（必学基础）

时间sk

已于 2025-01-10 22:34:09 修改

阅读量213

点赞数 3

分类专栏： CSS3 文章标签： css javascript 前端

于 2025-01-10 22:34:02 首次发布

本文链接：https://blog.csdn.net/weixin_63215361/article/details/145065331

版权

CSS3 专栏收录该内容

104 篇文章

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>rem单位</title>
		<style type="text/css">
			html{
				font-size: 10px;
			}
			div{
				font-size: 30px;
			}
			h4{
				background: red;width: 300px;height: 30px;
			}
			p{
				font-size: 2rem; 
				background: green;width: 20rem;
			}
		</style>
	</head>
	<body>
		<!--常用尺寸单位：-->
		<!--像素：px
			1.屏幕上的一个点作为单位，稳定精确
			2.用得最多的尺寸单位-->
		
		<!--em单位-->
			<!--1.em是以自身字体大小作为参考,是自身字体大小的倍数-->
			<!--2.当自身字体大小改变时，em会跟着改变-->
			
		<!--rem单位-->
			<!--1.rem是以根元素(html元素)字体大小作为参考,是根元素字体大小的倍数-->
			<!--2.当根元素字体大小改变时，rem会跟着改变-->
			
			
		<div>
			我爱学习
			<h4></h4>
			<p>我爱学习</p>
		</div>	
		
	</body>
</html>

在这里插入图片描述