首页 > 其他 > 详细

div和span的区别

时间:2015-11-29 23:02:17      阅读:338      评论:0      收藏:0      [点我收藏+]

<div>是一个块级元素,我们可以把它比喻成盒子,它没什么实际语义能用到很多地方,独占一行不能和其它元素在一行,它还能把<div>和<span>”装在盒子里”,主要用来组合段落和布局。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>div</title>
    <style>
        div.b{width:500px}
        div.b span{color:blue}
        div.b div{float: right}
    </style>

</head>
<body>
<div class="b">
    <p>我是一个<span>被span包含的段落</span></p>
    <div>
        <p>我是在div里的div</p>
    </div>
</div>
</body>
</html>
*h1是块级元素的
技术分享

 

 

<span>是行内元素,我们可以把它比喻成袋子,它也没有实际语义也能用到很多地方,如果没有样式它在视觉上和<p>一样,能和其它元素在一行,它的内容有多大宽度就有多宽,不能再里面添加<div>,它能把段落中的某一段”装起来”定义样式,能呈现很好的视觉效果。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>span</title>
    <style>
        div.a span{color:red}
    </style>
</head>
<body>
<div class="a">
    <ol>
        <li><span>2015.11.20</span>财务</li>
        <li>2015.11.20<span>人事</span></li>
        <li>2015.11.20销售</li>
    </ol>
    <ul>
        <li>我</li>
        <li><span>是</span></li>
        <li>谁</li>
    </ul>
</div>
</body>
</html>
*ol、li、ul是块级元素
技术分享

div和span的区别

原文:http://www.cnblogs.com/gantang/p/5005719.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!