浅谈物理与逻辑像素

最新推荐文章于 2024-08-05 10:20:31 发布

退去一身骄傲

最新推荐文章于 2024-08-05 10:20:31 发布

阅读量108

点赞数

本文链接：https://blog.csdn.net/pigZhangBoFei/article/details/100664713

版权

【前言】
今天学了很多，这里简单记录一下

【主体】
在这里插入图片描述
这里是代码

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>demo</title>
	<style type="text/css">
		*{
			margin: 0;
			padding: 0;
		}
		.demo{
			width: 600px;
			height: 600px;
			/*box-sizing: content-box;标准---宽度：width+padding+border*/
			box-sizing: border-box;/*IE盒模型---*/
			background: red;
			margin: auto;
			position: relative;
		}
		.child{
			width: 100px;
			height: 100px;
			background: green;
			margin: auto;
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translateX(-50%) translateY(-50%);
		}
	</style>

</head>
<body>
	<div class="demo">
		<div class="child"></div>
	</div>
</body>
</html>


今天先写到这里，如有问题，请联系小编