python—day45 z-index、margin的负值

1、z-index

2、margin的负值:margin-top:-20px;

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>margin的负值</title>
 6     <style>
 7         body{
 8             margin:0;
 9         }
10         .c1{
11             width: 200px;
12             height:200px;
13             background-color: red;
14         }
15         .c2{
16             width:300px;
17             height:300px;
18             background-color: green;
19             margin-top:-20px;
20         }
21     </style>
22 </head>
23 <body>
24 
25 
26 
27 
28 <div class="c1"></div>
29 <div class="c2"></div>
30 
31 
32 </body>
33 </html>
View Code

3、外边距的注意事项:

margin-bottom:100px; margin-top:50px;取最大px的;

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>外边距注意事项</title>
 6     <style>
 7         body{
 8             margin:0;
 9         }
10         .c1{
11             width:100%;
12             height:100px;
13             background-color: red;
14             margin-bottom:100px;
15 
16         }
17         .c2{
18             width:100%;
19             height:400px;
20             background-color:green;
21             margin-top:50px;
22         }
23     </style>
24 </head>
25 <body>
26 
27 <div class="c1"></div>
28 <div class="c2"></div>
29 
30 </body>
31 </html>
View Code

猜你喜欢

转载自www.cnblogs.com/kermitjam/p/9105021.html
今日推荐