|
|
@@ -12,7 +12,7 @@
|
|
|
background-color: red;
|
|
|
}
|
|
|
#demo2 {
|
|
|
- background-color: black;
|
|
|
+ /*background-color: black;*/
|
|
|
}
|
|
|
</style>
|
|
|
</head>
|
|
|
@@ -20,9 +20,28 @@
|
|
|
|
|
|
<div class="demo1" style="background-color: green">1</div>
|
|
|
<hr />
|
|
|
-<div class="demo1">2</div>
|
|
|
+<div class="demo1">2
|
|
|
+ <span class="demo3"></span>
|
|
|
+</div>
|
|
|
<hr />
|
|
|
-<div id="demo2">3</div>
|
|
|
-
|
|
|
+<div id="demo2">
|
|
|
+ <div id="positiondemo" style="width: 200px; height: 100px; background-color: red"> 我是内元素 </div>
|
|
|
+</div>
|
|
|
+ <input value="我是input" />
|
|
|
</body>
|
|
|
+<style>
|
|
|
+ /*padding margin*/
|
|
|
+ #positiondemo {
|
|
|
+ position: absolute;
|
|
|
+ left: 400px;
|
|
|
+ right: 200px;
|
|
|
+ }
|
|
|
+/*
|
|
|
+px 基于像素单位
|
|
|
+em 基于父元素 字体单位 // 1em 当前元素的 父元素 的1个字体 单位 font-size: 20px
|
|
|
+rem 基于根元素 字体单位 // 1em 等于 html 元素的 1个字体 单位
|
|
|
+vh 视口高度单位 1vh 就是一个视口宽度
|
|
|
+vw 视口宽度单位 1vw 就是网页可见高度
|
|
|
+*/
|
|
|
+</style>
|
|
|
</html>
|
