大家需要掌握的 html下SPAN和DIV的区别

SPAN 和 DIV 的区别在于,DIV(division)是一个块级元素,可以包含段落、标题、表格,乃至诸如章节、摘要和备注等。而SPAN 是行内元素,SPAN 的前后是不会换行的,它没有结构的意义,纯粹是应用样式,当其他行内元素都不合适时,可以使用SPAN。

  下面以一个实例来说明这两个属性的区别。

  代码:

  <span>SPAN标记有一个重要而实用的特性,即它什么事也不会做,它的唯一目的就是围绕你的HTML代码中的其它元素,这样你就可以为它们指定样式了。在此例中,<span>标识符允许你将一个段落分成不同的部分。

  还有一个标识符具有类似的功能,<div>DIV也被用来在HTML文件中建立逻辑部分。但与<div>SPAN不同,<div>工作于文本块一级,它在它所包含的HTML元素的前面及后面都引入了行分隔。

  效果:

  SPAN标记有一个重要而实用的特性,即它什么事也不会做,它的唯一目的就是围绕你的HTML代码中的其它元素,这样你就可以为它们指定样式了。在此例中,标识符允许你将一个段落分成不同的部分。

  还有一个标识符具有类似的功能, 
DIV也被用来在HTML文件中建立逻辑部分。但与 
SPAN不同, 
工作于文本块一级,它在它所包含的HTML元素的前面及后面都引入了行分隔。

(0)

相关推荐

  • 大家需要掌握的 html下SPAN和DIV的区别

    SPAN 和 DIV 的区别在于,DIV(division)是一个块级元素,可以包含段落.标题.表格,乃至诸如章节.摘要和备注等.而SPAN 是行内元素,SPAN 的前后是不会换行的,它没有结构的意义,纯粹是应用样式,当其他行内元素都不合适时,可以使用SPAN. 下面以一个实例来说明这两个属性的区别. 代码: <span>SPAN标记有一个重要而实用的特性,即它什么事也不会做,它的唯一目的就是围绕你的HTML代码中的其它元素,这样你就可以为它们指定样式了.在此例中,<span>标识

  • 网页中Span和Div的区别

    它们被用来组合一大块的HTML代码并赋予一定的信息,大部分用类属性class和标识属性id与元素联系起来,见CSS中级指南的类和id选择符. span和div的不同之处在于span是内联的,用在一小块的内联HTML中,而div(想想division是什么意思)元素是块级的(简单地说,它等同于其前后有断行),用于组合一大块的代码.   This is crazy 在实践中,div,特别是span不应该滥用,尽管有其他相左的意见.比如,你要强调单词"crazy"和加粗类"pape

  • jQuery中select与datalist制作下拉菜单时的区别浅析

    一般我们通常使用select制作下拉菜单,但是H5之后,datalist也可以充当select的角色,而且两者还有一点小的不同. 对于select来说,select的下拉菜单是供用户选择的,用户只能选择其中的选项不能自己添加. 但是datalist就不同了,datalist不仅可以供用户选择,用户还可以自己输入,而且datalist还可以达到模糊匹配的效果,使用很方便. 据代码示例如下: <input type="text" list="addr"/>

  • 对python中 math模块下 atan 和 atan2的区别详解

    atan 和 atan2 都是反正切函数,返回的都是弧度 对于两点形成的直线,两点分别是 point(x1,y1) 和 point(x2,y2),其斜率对应角度的计算方法可以是: angle = atan( (y2-y1)/(x2-x1) ) 或 angle = atan2( y2-y1, x2-x1 ) 因此可以看出 atan 和 atan2 的区别: 1.参数的个数不同:atan 为单个参数,atan2为两个参数 2.atan2 的优点在于: 如果 x2-x1等于0 ,角度依然可以计算,但是

  • 各版本IIS下ASP.net请求处理过程区别第1/3页

    绝大多数的人只熟悉高层的框架如: WebForms 和 WebServices --这些都在ASP.NET层次结构在最高层. 这篇文章的资料收集整理自各种微软公开的文档,通过比较 IIS5.IIS6.IIS7 这三代 IIS 对请求的处理过程, 让我们熟悉 ASP.NET的底层机制 并对请求(request)是怎么从Web服务器传送到ASP.NET运行时有所了解.通过对底层机制的了解,可以让我们对 ASP.net 有更深的理解. IIS 5 的 ASP.net 请求处理过程 对图的解释: IIS

  • 终于了解了下.net 和 j2ee的区别

    关于.NET技术与Sun公司的Java2企业版(J2EETM)相比较,许多客户都想了解Microsoft公司的观点.由于以下的几个原因,.NET和JEE的比较有点棘手: 1)   一般来说,Windows .NET Framework是Microsoft的Windows系统中经过精心定义的技术部分,而J2EE则是一个书面的协议.如果不局限于学术方面的讨论,换句话说,就是在几个应用平台上讨论这个话题的商业价值,那么仅仅比较J2EE和一个实际应用的工具是没有意义的. 这样实际应用的工具如:IBM公司

  • Python3中_(下划线)和__(双下划线)的用途和区别

    在看一些Python开源代码时,经常会看到以下划线或者双下划线开头的方法或者属性,到底它们有什么作用,又有什么样的区别呢?今天我们来总结一下(注:下文中的代码在Python3下测试通过) _ 的含义 在python的类中没有真正的私有属性或方法,没有真正的私有化. 但为了编程的需要,我们常常需要区分私有方法和共有方法以方便管理和调用.那么在Python中如何做呢? 一般Python约定加了下划线 _ 的属性和方法为私有方法或属性,以提示该属性和方法不应在外部调用,也不会被from ModuleA

  • 在ACCESS和SQL Server下Like 日期类型查询区别

    最近在用ACCESS数据库是遇到的问题总结: 一.在ACCESS中LIKE的用法 Access里like的通配符用法是这样: "?"表示任何单一字符: "*"表示零个或多个字符: "#"表示任何一个数字 所以应该是: select * from databasename where fieldname like '*XX*' 但在SQL SERVER 里是用%表示零个或多个字符 二.如何在ACCESS查询datetime类型字段的日期范围数据 如

  • vue.js移动端app之上拉加载以及下拉刷新实战

    上拉加载以及下拉刷新都是移动端很常见的功能,在搜索或者一些分类列表页面常常会用到. 跟横向滚动一样,我们还是采用better-scroll这个库来实现.由于better已经更新了新的版本,之前是0.几的版本,更新了一下发现,现在已经是1.2.6这个版本了,新版本多了些 比较好用的api,所以我也重写了之前的代码,用新的api来实现上拉加载以及下拉刷新. 首先把基本的样式写好,这里就略过了,然后引入better-scroll库 import BScroll from 'better-scroll'

  • JS实现文字向下滚动完整实例

    本文实例讲述了JS实现文字向下滚动的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>京东.淘宝晒单</title> <style> @charset "

随机推荐