div是块级元素，它不论大小默认占一行，而且可以设置宽高以及外边距
span是行内元素，它占它自身大小的位置，而且不能设置宽高以及边距
同时div也可以变为span (display:inline),这样div将变为行内元素
span也可以变为div(display:block),这样span将变为块级元素，默认占一行，而且可以设置宽高
同时，两者要想实现既可以设置宽高，边距，又可以不占一行，则display:inline-block

div和span互换的更多相关文章

  1. （4）《Head First HTML与CSS》学习笔记---文本的CSS规则和盒模型；div与span；<a>元素的链接色；伪类

    1.每个font-family包含一组共同特征的字体.共五个字体系列: sans-serif----这个系列包括了没有衬线的字体,与serif相比,通常认为这个系列更容易在计算机上识读. serif- ...

  2. div和span显示在同一行

    div和span标签的区别 div  是块级元素标签,独占一行,后面跟的内容换行显示 span  是内联元素标签,后面可以跟其他显示内容,不独占一行 display属性可以改变内联元素和块级元素的状态 ...

  3. CSS之div和span标签

    div和span是非常重要的标签,div的语义是division"分割": span的语义就是span"范围.跨度". 这两个东西,都是最最重要的"盒 ...

  4. Div和Span标签显示与隐藏

    本实例中,学习jQuery的知识,显示与隐藏网页上的div或是span标签. 实际环境中,也许是根据某些条件进行,符合条件时,对某个或是某个div或是span标签时行显示与隐藏. 主要是学习jQuer ...

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

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

  6. DIV与SPAN的区别

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

  7. HTML 的 <div> 和 <span> 标签

    这篇文章里会涉及到两个术语,这里先明确一下: 块级元素,block level element 内联元素(或者叫行内元素),inline element 大多数 HTML 元素被定义为块级元素和内联元 ...

  8. "无意义"的div和span标签

    HTML <div> 元素是块级元素,它是可用于组合其他 HTML 元素的容器.<div>元素没有特定的含义.除此之外,由于它属于块级元素,浏览器会在其前后显示折行.如果与 C ...

  9. HTML <div> 和 <span>

    可以通过 <div> 和 <span> 将 HTML 元素组合起来. HTML 块元素 大多数 HTML 元素被定义为块级元素或内联元素. 编者注:“块级元素”译为 block ...

随机推荐

  1. golang rabbitmq实践（啰嗦）

    目录 rabbitmq ubuntu下的配置 go 实现rabbitmq的消息收发 1:背景简介 我是一个.net一线开发,今年6月份离开帝都来到魔都,后入职于莫江互联网在线教育公司.现刚刚转正,在这 ...

  2. 洛谷 P5022 旅行——题解

    发现大部分题解都是O(n^2)的复杂度,这里分享一个O(n)复杂度的方法. 题目传送 首先前60%的情况,图是一棵无根树,只要从1开始DFS,每次贪心走点的编号最小的点就行了.(为什么?因为当走到一个 ...

  3. sql数据库相关语句

    易错点 Where需要放在from语句之后:where中不能出现聚合函数(就是能够将几行一列合并为一行一列的函数,比如max,min,avg,count()):但是可以出现其他,如比较符,getdat ...

  4. ACE官网

    ACE的官网是http://www.dre.vanderbilt.edu/~schmidt/ACE.html 文档的官网是https://htmlpreview.github.io/?https:// ...

  5. Python学习之==>接口开发

    一.开发接口的作用 1.在别的接口没有开发完成的时候可以模拟一些接口以便测试已经开发完成的接口,例如假的支付接口,模拟支付成功.支付失败. 2.了解接口是如何实现的:数据交互.数据返回 3.开发给别人 ...

  6. HTML5——添加新元素 新元素 Canvas SVG MathML 黑客帝国特效

    为HTML添加新元素 添加新元素   +   该元素定义样式 <!DOCTYPE html> <html> <head> <meta charset=&quo ...

  7. 【HANA系列】SAP HANA SQL获取上周的周一

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA SQL获取上周 ...

  8. Java多线程学习——知识点积累

    开启多线程时,每一个线程都拥有自己的工作空间,每个工作空间都单独的和主存打交道. 并发的概念:多个线程同时操作同一个对象 当产生并发时,如果从工作空间写入数据到内存的线程时间片用完了,其他线程再从主存 ...

  9. face-api.js 前端人脸识别，人脸检测，登录认证

    1.参考face-api.js https://github.com/justadudewhohacks/face-api.js#face-api.js-for-the-browser

  10. 【Qt开发】Qt在Windows下的三种编程环境搭建

    从QT官网可以得知其支持的平台.编译器和调试器的信息如图所示: http://qt-project.org/doc/qtcreator-3.0/creator-debugger-engines.htm ...