z-index、display、selector选择器优先级css优先级面试用到
z-index：控制元素叠放顺序，哪个z-index数值越大，那个优先被叠放在上面。
relative、absolute、fixed这三种情况可以使用z-index。
static不可以使用。
display属性：
常见属性值：
1.none；隐藏对象（对象完全消失于文档流）而opacity：0；（透明度）完全透明，hidden也是隐藏，但是还留有位置。
2.inline；指定对象为内联元素
3.block； 指定对象为块元素
4.inline-block；指定对象为内联块元素
5.table-cell；指定对象作为表格单元格：
我们在使用table时，单元格是有垂直居中的特性的。
原因是单元格具有“table-cell”属性，我们为了使其他元素具有这种属性添加：
display：table-cell；和vertical-align：middle；这两个属性，使它里面的内容可以居中显示。
（加了table-cell属性的行内元素可以设置宽和高。）例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/reset.css"/>
<style type="text/css">
table,div{border: 1px solid red;}
td,div{width: 300px; height: 100px;}
div{display: table-cell; vertical-align: middle;}
</style>
</head>
<body>
<table>
<tr>
<td>allalalal</td>
</tr>
</table>
<div>allalalal</div>
</body>
</html>
此例两个显示一样。
如果用line-height也可以做到，但是line-height要跟随元素的高度，如果修改需要手动修改，而
table-cell是自适应的，比较方便。
css优先级：
优先级数值比较，以数值大的为准：（有一种更高的优先级！important，但是这不属于正常的形式，不建议使用。）
style{行内样式} = 1000
id=100
class="10"
element（元素也叫selector）=1
通常面试时问到的css选择器是指“基础选择器”的优先级，如下：
id>class>元素>*
important>内联>ID>类>标签|伪类|属性选择器>伪元素>集成>通配符
z-index、display、selector选择器优先级css优先级面试用到的更多相关文章
- css选择器及css优先级
三个css选择器:id选择器#test1{ }.class选择器.test2{ }.标签选择器div{ }对三个div:<div>我是普通div</div>.<div i ...
- 关于CSS的优先级,CSS优先级计算
原则一: 继承不如指定原则二: #id > .class > 标签选择符原则三:越具体越强大原则四:标签#id >#id ; 标签.class > .class CSS优先级权 ...
- 关于CSS的优先级,CSS优先级计算,多个class引用
原则一: 继承不如指定 原则二: #id > .class > 标签选择符 原则三:越具体越强大 原则四:标签#id >#id ; 标签.class > .class CSS优 ...
- CSS选择器优先级 CSS权值
计算指定选择器的优先级:重新认识CSS的权重 标签的权值为 0,0,0,1 类的权值为 0,0,1,0 属性选择的权值为 0,0,1,1 ID的权值为 0,1,0,0 important的权值为最高 ...
- CSS优先级问题以及jQuery中的.eq()遍历方法和:eq()选择器的差别
在写一个TAB选项卡的时候遇到几个有意思的问题,记录下来 先把代码贴出来 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition ...
- CSS选择器整理以及优先级介绍
一.基础选择器 选择器 名称 描述 兼容性 * 通配选择器 选择所有的元素 ie6+ E 元素选择器 选择指定的元素 ie6+ #idName id选择器 选择id属性等于idName的元素 ie6+ ...
- CSS优先级
一.CSS代码出现的几个位置 多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下:(外部样式)Extern ...
- css 优先级的bug
对于前端而言,了解css样式的优先级,对开发或处理bug有着事半功倍的效果,今天在做项目的时候,突然碰到一个优先级的小问题,刚开始不知道所因,后来才发现这个问题是由优先级造成的.先描述下问题,鼠标悬停 ...
- 前端面试题-CSS优先级
一.选择器优先级 浏览器通过优先级来判断哪一些属性值与一个元素最为相关,从而在该元素上应用这些属性值.优先级是基于不同种类选择器组成的匹配规则. 二.优先级计算 优先级就是分配给指定的CSS声明的一个 ...
随机推荐
- [原创]java WEB学习笔记92：Hibernate学习之路-- -QBC 检索和本地 SQL 检索：基本的QBC 查询，带 AND 和 OR 的QBC，统计查询，排序，分页
本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...
- AJAX-----05XMLHttpRequest对象的用post方式进行ajax请求
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jQuery : eq() vs get()
.get(index) and .eq(index) both return a single "element" from a jQuery object array, but ...
- Unix/Linux编程实践教程（0：文件、终端、信号）
本来只打算读这本书socket等相关内容,但书写得实在好,还是决定把其余的内容都读一下. 阅读联机帮助的一个示例: open系统调用: read系统调用: Unix的time: 上面的printf可以 ...
- Android网络框架源码分析一---Volley
转载自 http://www.jianshu.com/p/9e17727f31a1?utm_campaign=maleskine&utm_content=note&utm_medium ...
- 普华永道高级JAVA面试记录
最近在考虑换个工作 原因?咱能不逗吗? 一面感觉发挥不错 二面之后累觉不爱 基本上浪费了半天的工资(好多钱啊~~~) PWD上海地址在浦东软件园 工作环境说实话没我现在工作的环境好,不过里面的人 ...
- HTML5的数据自动补齐功能
使用datalist元素,HTML5允许使用一组数据来生成自动补齐功能,现在你不需要使用第三方js代码或者类库啦! <input name="frameworks" list ...
- selenium处理Ajax浮动框方法
package com.allin.pc;import java.util.List;import org.openqa.selenium.WebElement;import org.openqa.s ...
- storm配置项目
java.library.path: “/usr/local/lib:/opt/local/lib:/usr/lib”### storm.* configs are general configura ...
- springMVC简单示例
1.新建web工程 2.引入springframework架包 3.配置文件 web.xml <?xml version="1.0" encoding="UTF-8 ...