CSS之尺寸

CSS尺寸控制详解

最新推荐文章于 2023-06-20 11:13:25 发布

web菜鸟程序猿

最新推荐文章于 2023-06-20 11:13:25 发布

阅读量429

点赞数

CC 4.0 BY-SA版权

分类专栏： CSS 文章标签： CSS HTML

本文链接：https://blog.youkuaiyun.com/zhou0107/article/details/9146015

CSS 专栏收录该内容

14 篇文章

订阅专栏

本文通过三个实例详细介绍了如何使用CSS来控制元素的高度、宽度、最大高度、最大宽度、最小高度和最小宽度等属性，帮助读者更好地理解并运用这些样式属性。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-cn">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>CSS尺寸</title>
	<style type="text/css">	
	/*
	*height	设置元素的高度。
	*line-height	设置行高。
	*max-height		设置元素的最大高度。
	*max-width		设置元素的最大宽度。
	*min-height		设置元素的最小高度。
	*min-width		设置元素的最小宽度。
	*width	    	设置元素的宽度。
	*/
	.div_1{
		max-height:24px;
		max-width:500px;
		border:1px solid blue;
		height:40px;
	}
	.div_2{
		min-height:18px;
		min-width:100px;
		border:1px solid blue;
		height:10px;
	}
	.div_3{
		line-height:40px;
		border:1px solid blue;
	}
	</style>
</head>
<body>
	<div class="div_1">css尺寸控制：最大高度和最大宽度</div>
	<div class="div_2">css尺寸控制：最小高度和最小宽度</div>
	<div class="div_3">css尺寸控制</div>	
</body>
</html>