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 ...
随机推荐
- L1-1. 出生年【STL放的位置】
L1-1. 出生年 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 以上是新浪微博中一奇葩贴:“我出生于1988年,直到25岁才 ...
- 洛谷——P2196 挖地雷
题目背景 NOIp1996提高组第三题 题目描述 在一个地图上有N个地窖(N<=20),每个地窖中埋有一定数量的地雷.同时,给出地窖之间的连接路径.当地窖及其连接的数据给出之后,某人可以从任一处 ...
- Codeforces Gym 100431B Binary Search 搜索+组合数学+高精度
原题链接:http://codeforces.com/gym/100431/attachments/download/2421/20092010-winter-petrozavodsk-camp-an ...
- netty-类图对比
- spring管理事务
2.1 事务管理器 Spring并不直接管理事务,而是提供了多种事务管理器,他们将事务管理的职责委托给Hibernate或者JTA等持久化机制所提供的相关平台框架的事务来实现. Spring事务管理器 ...
- 【MyEcplise】设置右键快捷菜单的方法
在我们右键新建项目或文件时,有许多的选项我们几乎是不用的,那就没有必要放在右键的快捷菜单中:而有些选项是我们经常会用的,但是右键快捷菜单有没有,我们总是需要选择其它去到弹出的对话框中取选取.这些操作很 ...
- 高通msm8994启动流程简单介绍
处理器信息 8994包括例如以下子系统: 子系统 处理器 含义 APSS 4*Cortex-A53 应用子系统 APSS 4*Cortex-A57 应用子系统 LPASS QDSP6 v5.5A(He ...
- python matplotlib imshow热图坐标替换/映射
今天遇到了这样一个问题,使用matplotlib绘制热图数组中横纵坐标自然是图片的像素排列顺序, 但是这样带来的问题就是画出来的x,y轴中坐标点的数据任然是x,y在数组中的下标, 实际中我们可能期望坐 ...
- 手动安装pip
apt-get instal pip 成功之后,有根据pip的提示,进行了升级,升级之后,pip就出问题了 为了解决上面问题,手动安装pip,依次执行下面命令 1 2 3 4 5 [root@min ...
- Error building Player: Win32Exception: ApplicationName='E:/adt-20140702/sdk\tools\zipalign.exe', Com
1.原因 更新sdk后报错..由于版本号不同,zipalign.exe所处路径不同 2.解决的方法 在sdk路径下搜索zipalign.exe .然后拷贝到报错内容中制定的路径即可了.