DIV+CSS布局(一)

转载于 2017-11-27 22:31:00 发布 · 58 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/lzp1103/p/7906507.html

1.div和span

　　DIV和SPAN在整个HTML标记中，没有任何意义，他们的存在就是为了应用CSS样式

　　DIV和SPAN的区别在与，span是内连元素，div是块级元素

2.盒模型

　　margin:盒子外边框

　　padding:盒子内边框

　　border:盒子边框宽度

　　width:盒子宽度

　　height:盒子高度

eg:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>DIV＋Css布局(div＋span以及盒模型)</title>
    <style type="text/css">
        div{
            background-color: green;
            color: #ffffff;
            width: 500px;
            height: 500px;
            padding: 10px;
        }
        span{
            background-color: green;
            color: #ffffff;
        }
        body{
            margin: 0px;
            border: 10px;
            padding: 10px;
        }
    </style>

</head>
<body>
    <div>第十四天div</div>
    <div>第十四天div</div>
    <span>第十四天div</span>
    <span>第十四天div</span>
</body>
</html>