div和span、relative和absolute、display和visibility的区别
一、div和span的区别
div是一个块级元素,可以包含段落,表格等内容,用于放置不同的内容。一般我们在网页通过div来布局定位网页中的每个区块。
span是一个内联元素,没有实际意义,它的存在纯粹是为了应用样式,给一段内容加上<span></span>标记可以通过在span上定义样式来设定其内容的样式。
二、relative和absolute的区别
relative,CSS中的写法是:position:relative; 他的意思是绝对相对定位,他是参照父级的原始点为原始点,无父级则以BODY的原始点为原始点,配合TRBL进行定位,当父级内有padding等CSS属性时,当前级的原始点则参照父级内容区的原始点进行定位。
absolute,CSS中的写法是:position:absolute; 他的意思是绝对定位,他是参照浏览器的左上角,配合TOP、RIGHT、BOTTOM、LEFT(下面简称TRBL)进行定位,在没有设定TRBL,默认依据父级的做标原始点为原始点。如果设定TRBL并且父级没有设定position属性,那么当前的absolute则以浏览器左上角为原始点进行定位,位置将由TRBL决定。
三、display和visibility的区别
display:none和visibility:hidden都可以隐藏一个元素
但visibility:hidden只是隐藏了元素的内容,但其使用的位置空间仍然被保留。
而display:none则相当把元素从页面中去除,其占用位置也将被删除。
div和span、relative和absolute、display和visibility的区别的更多相关文章
- display和visibility的区别
一.display和visibility的相同与不同点 1.相同点:display和visibility都有讲元素隐藏的意思 2.不同点:display是元素隐藏,隐藏的元素不占文档流 而visibi ...
- 基础总结(04)-- display:none;&&visibility:hidden;区别
display:none 1.使元素隐藏,不再占据空间. 2.动态操作时会引起页面回流和重绘,影响性能. 3.子元素也会被隐藏并且添加display:block/visibility:visible无 ...
- display 和 visibility 的区别
设置控件隐藏 1.display:none 不为元素保留位置 2.visibility:hidden 占位置,是对象在网页上看不到,所占空间没有变化
- display与visibility的区别
style.visibility和style.display都可以实现对页的隐藏,但visibility要占用域的空间,而display则不占用 将元素display属性设为 block,会在该元素后 ...
- Display与 Visibility的区别
隐藏元素的方法有: display:none或visibility:hidden visibility:hidden可以隐藏某个元素,但隐藏的元素仍需占用与未隐藏之前一样的空间.也就是说,该元素虽然被 ...
- 控制HTML元素的显示与隐藏——display和visibility
有些时候我们需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏,可以通过display或visibility来实现.通过下面的例子了解display和visibility的区别,简单的例子代 ...
- css3-10 如何控制元素的显示和隐藏(display和visibility的区别是什么)
css3-10 如何控制元素的显示和隐藏(display和visibility的区别是什么) 一.总结 一句话总结:使用的时候直接在元素的样式中设置display和visibility属性即可.推荐使 ...
- CSS+DIV定位分析(relative,absolute,static,fixed)
在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolute,static,fixed分的不是很清楚,以致经常会出现让人很郁闷的结果.今天研究了一下,总算有所 ...
- display值的作用分别是什么?relative和absolute分别是相对谁定位的?
display值的作用分别是什么? none:元素隐藏,不占据位置 block:该元素显示为块级元素 inline:默认,该元素会被显示为内联元素 inline-block:行内块元素 list-it ...
随机推荐
- Arduino可穿戴教程ArduinoIDE新建编辑源文件
Arduino可穿戴教程ArduinoIDE新建编辑源文件 Arduino IDE新建源文件 Arduino IDE启动后默认就新建了一个源文件,如图2.20所示.新建的源文件名称是以sketch_开 ...
- 用Java做一个跳一跳辅助
Java跳一跳辅助 首先..让大家看下效果: 由于是闲着没事写的.也懒得看OpenCV的API了. 要用到的工具如下: adb+jdk 把adb添加到环境变量里就行.很简单. 全部代码如下.就这么多. ...
- Maven 项目打包发布
在Eclipse左侧右击项目,Debug As -> Debug Configurations -> 双击Maven Build 然后看弹出框的右侧右侧的Name随便填写一个名字,Base ...
- javascript好文 --- 深入理解可视区尺寸client
可视区大小 可视区大小client又称为可见大小或客户区大小,指的是元素内容及其内边距所占据的空间大小 clientHeight clientHeight属性返回元素节点的可见高度 clientHei ...
- 类加载器在加载类 的时候就已经对类的static代码块和static变量进行了初始化
类装载器ClassLoader 类装载器工作机制 类装载器就是寻找类的节码文件并构造出类在JVM内部表示对象的组件.在Java中,类装载器把一个类装入JVM中,要经过以下步骤: [1.]装载:查找和导 ...
- class文件无论是32位还是64位jdk编译出来的,都可以通用
class文件无论是32位还是64位jdk编译出来的,都可以通用 学习了:https://blog.csdn.net/z3111001358/article/details/53364066 java ...
- XPath可以快速定位到Xml中的节点或者属性。XPath语法很简单,但是强大够用,它也是使用xslt的基础知识。
示例Xml: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <?xml versio ...
- scala使用FunSpec进行单元测试报错
遇到比较奇怪的问题,mvn项目中的main函数可以正常运行,但是test阶段出错,报错信息如下: Exception in thread "main" java.lang.NoCl ...
- 合并SO为单独交货单
本场景为单步交货 为客户建立专用的route. 增加一个pull rule 在做订单的时候,为订单行选择 上面建立好的route, 连续建立了 2个 订单 SO ...
- C99_变长结构体实现
/************************************************************************* > File Name: C99_lengt ...