패딩값 마진값을 당연히 가질수 있지만 다른 블럭과 영향은 미치지 않는다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> .wrap{ outline: 1px solid tomato; margin-top: 100px; } .i{ width: 100px; height: 100px; outline: 1px solid tomato; background-color: rgba(20, 0, 0, 0.5); outline: solid tomato 1px; display: inline; margin: 40px; padding: 30px; } .b{ width: 100px; height: 200px; outline: 1px solid tomato; background-color: rgba(255, 0, 0, 0.5); } .footer{ margin: 0 auto; height: 50px; outline: 1px solid tomato; background-color: #eee; } </style> </head> <body> <div class="wrap"> <div class="i">inline</div> <div class="b">block</div> </div> <div class="footer">footer</div> </body> </html> |
'기타 > -HTML&CSS' 카테고리의 다른 글
태광실업 반응형 사이트 (0) | 2017.02.22 |
---|---|
CSS 시작??? (0) | 2017.02.20 |
HTML 시작!~ (1) | 2017.02.20 |
티스토리 html, css (1) | 2017.02.20 |