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 ...
随机推荐
- Codeforces 919 A. Supermarket
这场cf有点意思,hack场,C题等于1的特判hack很多人(我hack成功3个人,上分了,哈哈哈,咳咳...) D题好像是树形dp,E题好像是中国剩余定理,F题好像还是dp,具体的不清楚,最近dp的 ...
- (5)DataSet
DataTable赋值给DataSet DataSet ds = new DataSet(); DataTable dt1 = new DataTable(); DataTable dt2 = new ...
- Xamarin.Forms的滚动视图ScrollView
Xamarin.Forms的滚动视图ScrollView 在Xamarin.Forms中,滚动视图ScrollView用来实现长内容的滚动显示.虽然ScrollView的Content属性只能设置 ...
- 仿照jquery封装一个自己的js库
所谓造轮子的好处就是复习知识点,加深对原版jquery的理解.本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包括 ...
- Android自定义控件之自定义属性(二)
前言: 上篇介绍了自定义控件的基本要求以及绘制的基本原理,本篇文章主要介绍如何给自定义控件自定义一些属性.本篇文章将继续以上篇文章自定义圆形百分比为例进行讲解.有关原理知识请参考Android自定义控 ...
- Fresco的使用<一>
版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] 引入Fresco dependencies { // 添加依赖 compile 'com.facebook.fresco:fre ...
- 远程的jmeter自动执行完,如何回调通知被调用者“结束”状态
场景:python应用通过paramiko在远程服务器上启动jmeter执行性能压测,压测完,jmeter通过回调函数告诉应用‘执行状态’ 方案:python应用写一个restful api,接收jm ...
- Hadoop 2.2.0集群搭建
一.环境说明 1.虚拟机平台:VMware10 2.Linux版本号:ubuntu-12.04.3-desktop-i386 3.JDK:jdk1.7.0_51 4.Hadoop版本号:2.2.0 5 ...
- from: 关于RabbitMQ
from: http://lynnkong.iteye.com/blog/1699684 1 什么是RabbitMQ? RabbitMQ是实现AMQP(高级消息队列协议)的消息中间件的一种, ...
- MKVToolNix v8.7.0
功能强大的MKV封装格式视频文件制作和编辑工具,支持音轨.字幕的封装,高清发烧友必备工具. 百度云:http://pan.baidu.com/s/1eQWPnxS password:ll64 360 ...