DIV 和 SPAN 元素最大的特点是默认都没有对元素内的对象进行任何格式化渲染。主要用于应用样式表(共同点)。

两者最明显的区别在于DIV是块元素,而SPAN是行内元素(也译作内嵌元素)。

详解:1.所谓块元素,是以另起一行开始渲染的元素,行内元素则不需另起一行,测试一下下面的代码你会有更形象的理解:

测试<span>紧跟前面的"测试"显示</span><div>这里会另起一行显示</div>

2.块元素和行内元素也不是一成不变的,通过定义CSS的display属性值可以互相转化,如:

测试<div style="display:inline">紧跟前面的"测试"显示</div>

<span style="display:block">这里会另起一行显示</span>

所以<div> 等于 <span style="display:block"> 都会另起一行

所以<div style="display:inline"> 等于 <span > 都会紧接着显示

DIV 和 SPAN 区别的更多相关文章

  1. [转]div与span区别及用法

    DIV与SPAN区别及div与san用法篇 接下来了解在div+css开发的时候在html网页制作,特别是标签运用中div和span的区别及用法.新手在使用web标准(div css)开发网页的时候, ...

  2. div与span区别及用法

    DIV与SPAN区别及div与san用法篇 接下来了解在div+css开发的时候在html网页制作,特别是标签运用中div和span的区别及用法.新手在使用web标准(div css)开发网页的时候, ...

  3. <div> <p> <span>的用法和区别

    <div> 标签可以把文档分割为独立的.不同的部分.它可以用作严格的组织工具,并且不使用任何格式与其关联. 更重要的意义是在网页的动态实现过程中,对划分的区域统一处理,例如换背景色.字体等 ...

  4. DIV与SPAN的区别

    DIV 和 SPAN 元素最大的特点是默认都没有对元素内的对象进行任何格式化渲染.主要用于应用样式表(共同点). 两者最明显的区别在于DIV是块元素,而SPAN是行内元素(也译作内嵌元素). 详解:1 ...

  5. 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍

    01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline   ...

  6. DIV与SPAN之间有什么区别

    DIV与SPAN之间有什么区别 DIV 和 SPAN 元素最大的特点是默认都没有对元素内的对象进行任何格式化渲染.主要用于应用样式表(共同点). 两者最明显的区别在于DIV是块元素,而SPAN是行内元 ...

  7. div和span元素的区别

    2个都是用来划分区间但是没有实际语义的标签,差别就在于div是块级元素,不会其他元素在同一行;span是内联元素,可以与其他元素位于同一行. DIV 和 SPAN 元素最大的特点是默认都没有对元素内的 ...

  8. HTML中Div、span、label标签的区别

    div与span 大家在初学div+css布局时,有很多困惑,在div与span的使用过程没觉得有一定的”章法”,觉得两个区别不大,在w3c的关于div和span的定义:div作为分割文档结构自然使它 ...

  9. div和span、relative和absolute、display和visibility的区别

    一.div和span的区别 div是一个块级元素,可以包含段落,表格等内容,用于放置不同的内容.一般我们在网页通过div来布局定位网页中的每个区块. span是一个内联元素,没有实际意义,它的存在纯粹 ...

随机推荐

  1. 建立TCP连接的三次握手

    请求端(通常称为客户)发送一个 SYN 报文段( SYN 为 1 )指明客户打算连接的服务器的端口,以及初始顺序号( ISN ).服务器发回包含服务器的初始顺序号( ISN )的 SYN 报文段( S ...

  2. 转载:数位DP模板

    // pos = 当前处理的位置(一般从高位到低位) 2 // pre = 上一个位的数字(更高的那一位) 3 // status = 要达到的状态,如果为1则可以认为找到了答案,到时候用来返回, 4 ...

  3. IOS 使用动态库(dylib)和动态加载framework

    在iphone上使用动态库的多为dylib文件,这些文件使用标准的dlopen方式来使用是可以的.那相同的在使用framework文件也可以当做动态库的方式来动态加载,这样就可以比较自由的使用appl ...

  4. hadoop yarn 易理解

    Hadoop 和 MRv1 简单介绍 Hadoop 集群可从单一节点(其中所有 Hadoop 实体都在同一个节点上运行)扩展到数千个节点(其中的功能分散在各个节点之间,以增加并行处理活动).图 1 演 ...

  5. thinkPHP16---伪静态

    url伪静态通常是为了 满足更好的SEO效果,thinkPHP支持伪静态url设置,可以通过设置URL_HTML_SUFFIX的参数 随意在URL的最后添加你想要的静态后缀,而不会影响当前操作的正常执 ...

  6. Linux -- ls只显示目录

    ls没有直接显示目录的选项, 不过根据目录和文件显示的差异,可以搭配grep来实现 方法1: ll | grep "^d" 方法2: ls -F | grep$ "/$& ...

  7. Chapter 1 First Sight——16

    I drove around the school, following the line of traffic. 我开车绕学校随着交通线. 我开车穿过校园,紧跟着大部队. I was glad to ...

  8. opencv ,亮度调整【【OpenCV入门教程之六】 创建Trackbar & 图像对比度、亮度值调整

    http://blog.csdn.net/poem_qianmo/article/details/21479533 [OpenCV入门教程之六] 创建Trackbar & 图像对比度.亮度值调 ...

  9. sphinx multi valued filter

    publn_date is multi-valued <?php ini_set('memory_limit', '-1'); ini_set('max_execution_time', '10 ...

  10. HDU 1754 I Hate It(线段树基础应用)

    基础线段树 #include<iostream> #include<cstdio> #include<cstring> using namespace std; # ...