常见兼容性问题场景

青年为何白发

已于 2022-09-24 00:19:54 修改

阅读量172

点赞数

分类专栏：前端三剑客文章标签： html 前端 javascript

于 2022-09-23 22:58:48 首次发布

本文链接：https://blog.csdn.net/weixin_45650998/article/details/127019350

版权

前端三剑客专栏收录该内容

9 篇文章 1 订阅 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

1、IE6下怪异盒模型

<!DOCTYPE html>
<html> 
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			div{
				width: 100px;
				height: 100px;
				border: 10px solid #000;
				padding: 10px;
				background: red;
			}
			.box2{
				/* 设置为怪异盒模型 */
				box-sizing: border-box;
			}

		</style>
	</head>
	<body>
		<!--
			标准盒模型
				整个DIV总宽度=width+padding+border
			怪异盒模型
				整个DIV总宽度=width
				
			切记一定要写文档头
		-->
		<div class="box1">标准盒模型</div>
		<div class="box2">怪异盒模型</div>
	</body>
</html>