css样式之边框和内外边距
1、css樣式之邊框:border
實心的邊框:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>頁面一</title>
</head>
<body>
? ? ? ? ?<div style="border:1px solid blue;height:200px"></div>
</body>
</html>
虛心的邊框:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>頁面一</title>?
</head>
<body>
? ? ? ? ?<div style="border:1px dotted blue;height:200px"></div>
</body>
</html>
2、css樣式之內外邊距
外邊距:margin
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>頁面一</title>
</head>
<body>
? ? <div style="height:200px;border:1px solid red;">
? ? ? ? <div style="height:30px;background-color:#999;margin-top:10px;margin-left:1250px;margin-right:10px;">
? ? ? ? guojianglin
? ? ? ? </div>
? ? </div>
</body>
</html>
內邊距:padding
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>頁面一</title>?
</head>
<body>
? ? <div style="height:200px;border:1px solid red;">
? ? ? ? ?<div style="height:30px;background-color:#999;padding-top:50px;">
? ? ? ? ? guojianglin
? ? ? ? ?</div>
? ? </div>
</body>
</html>
轉載于:https://www.cnblogs.com/Brin-guo/p/4845350.html
總結
以上是生活随笔為你收集整理的css样式之边框和内外边距的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 搜个性签名最流行的
- 下一篇: 屏蔽浏览器默认样式 user agen