盒子模型
Posted 壹路桐行丨
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了盒子模型相关的知识，希望对你有一定的参考价值。
盒子模型，学习了css以后 发现现在用的最多的选择器是class，代码先记一下。毕竟以后忘记了看见代码想到的总会比看不到想到的多许多。
<meta charset="UTF-8">
<title></title>
<style>
.out{
width: 200px;
height: 200px;
border: 4px solid black;
position: relative;
padding: 10px;
}
.in{
width: 50px;
height: 50px;
background-color: red;
position: relative;
margin-left: 30px;
margin-top: 30px;
margin-bottom: 30px;
z-index: 20;
}
.in2{
width: 50px;
height: 50px;
background-color: blue;
position: relative;
z-index: 10;
margin: -50px 0px 0px 0px;
}
</style>
</head>
<body>
<div class="out">
<div class="in">ABCD</div>
<div class="in2">EFGH</div>
</div>
<input style="margin: 100px;padding: 5px 0px 0px 30px;" type="text" />
</body>
还有感慨就是熟能生巧，卖油翁的故事非常深刻
以上是关于盒子模型的主要内容，如果未能解决你的问题，请参考以下文章