一.display

  1.display:none  隐藏标签

  2.display:inline  将块级标签改为内联标签

  3.display:block  将内联标签改为块级标签

  4.display:inline-block  块级内联兼并,不独占一行,可以设置宽高

二.float浮动

  任何元素都可以浮动,浮动后就变成了块级标签,它会尽可能窄,造成塌陷,所以要clear清除浮动(relative也属于浮动)

  1.float:none  默认值,不浮动

  2.float:left  左浮动

  3.float:right  右浮动

三.clear 

.clearfix:after {
content: '';
display: block;
clear: both;
}

clear清除浮动后父级标签塌陷

  1.clear:left  左侧不允许有浮动

  2.clear:right  右侧不允许有浮动

  3.clear:both  两侧都不允许有浮动

四.overflow溢出

  overflow-x\overflow-y能独自设置x\y轴的内容

  1.overflow:visible  默认值,不会做出任何处理

  2.overflow:hidden  隐藏溢出内容

  3.overflow:scroll  滚动溢出内容

五.position定位

  1.position:relative  相对自身位置移动

  2.position:absolution  根据有relative的父级以上级别(都没有就按body)的位置作为相对位置进行移动

  3.position:fixed  根据窗口进行移动

  left\right\top\bottom:10px

六.z-index

  如果定位后覆盖了其他标签,又想优先显示其他标签,就可以用z-index给标签设置优先级

  z-index:1000;  谁的数值大就优先显示谁

七.opacity  

  给标签内所有内容定义透明度

css中元素的位置的更多相关文章

  1. CSS中常见的位置(position)属性

    常用的位置属性列表: position(top.bottom.left.right) .overflow.z-index position用法: 值 描述 relative 相对定位,原位置仍占用空间 ...

  2. css中元素定位

    在html中网页可以看成一个立体的空间,一个完整的页面是由很多个页面堆积形成的,如下图所示 CSS中Position属性有四个可选值,它们分别是:static.absolute.fixed.relat ...

  3. css中元素border属性的构成以及配合属性值transparent可得到一些特殊形状1.0

    css中我们经常使用到元素的border属性和属性值transparent,可能好多人还不太了解border的构成以及配合transparent的一些效果: 1.border的构成如下所示:   ht ...

  4. CSS中元素水平居中和垂直居中的方法

    #CSS中水平居中和垂直居中的方法 一. 水平居中 1.行内元素(文本,图片等) 如果被设置元素为文本.图片等行内元素时,可以通过给父元素设置` text-align:center;` 来实现 2.定 ...

  5. java android 将 List中元素互换位置

    很多时候我要对List中的元素调换位置,这时候可以用如下代码,意思是将data中的index1与index2元素互换位置 //data 为List Collections.swap(data,inde ...

  6. CSS中元素的显示模式

     在CSS中,根据元素显示模式的不同元素标签被分为了两类:行内元素(inline-level).块级元素(block-level). 1,首先介绍什么是行内元素,什么又是块级元素? 1.1,行内元素就 ...

  7. css中元素的auto属性值是什么意思,比如margin:0 auto表示什么?

    auto 你可以理解为一种 自动/自适应 的概念 比如 现在项目需要一个宽度为960px的整体布局居中 根据用户浏览器大小不同你将需要使用margin:0 auto;来实现. 无论用户浏览器宽度为多少 ...

  8. css中元素居中总结

    很多时候,我们需要让元素居中显示:1. 一段文本的水平居中,2. 一张图片的水平居中,3. 一个块级元素的水平居中:4. 单行文本的竖直居中,5. 不确定高度的一段文本竖直居中,6. 确定高度的块级元 ...

  9. CSS中属性position位置详解功能讲解与实例分析

    position有五个值:static.relative.absolute.fixed.inherit. static 是默认值.就是按正常的布局流从上到下从左到右布局,平常我们做网页制作时,没有指定 ...

随机推荐

  1. 电商项目中学到的git命令

    1.在拉下来的文件夹被删除后的操作 创建了文件后 git init 增加了 .git文件 ls -al 查看后有.git文件夹 git remote add origin (ssh) 连接到git仓库 ...

  2. PHP20-challenge12

      看下eval+var_dump的妙用.   eval会执行括号中的内容:var_dump中内容是字符串时输出的模式是 string(x) "xxxx".如果他俩结合,是可以很好 ...

  3. 不要62(数位DP)

    不要62 http://acm.hdu.edu.cn/showproblem.php?pid=2089 Time Limit: 1000/1000 MS (Java/Others)    Memory ...

  4. AngularJS——第11章 其它

    第11章 其它 11.1jQuery 在没有引入jQuery的前提下AngularJS实现了简版的jQuery Lite,通过angular.element不能选择元素,但可以将一个DOM元素转成jQ ...

  5. JsRender 学习总结

    jsRender 三个最重要的概念:模板.容器和数据. 最重要的是:view(视图) 是我们定义的模板,上下文是视图所用的对象. 一.基础. {{:}} 和 {{>}}(或{{html:}})两 ...

  6. easyrules

    http://www.easyrules.org/tutorials/hello-world-tutorial.html

  7. linux C程序中获取shell脚本输出(如获取system命令输出)

    转载自 http://blog.csdn.net/hjxhjh/article/details/7909518 1. 前言 Unix 界有一句名言:“一行shell脚本胜过万行C程序”,虽然这句话有些 ...

  8. .net中使用XPath语言在xml中判断是否存在节点值的方法

    book.xml<?xml version="1.0" encoding="utf-8" ?> <bookstore>  <boo ...

  9. springBoot整合Quarzt2.3

    首先,你要配置好springboot的配置(在resources下) 我把其改为application.yml # Tomcat server: tomcat: uri-encoding: UTF-8 ...

  10. 10.Mysql索引

    10.索引的设计和使用10.1 索引概述BTREE索引:Mysql(MyIASM和Innodb)默认的索引类型.前缀索引:对索引字段的前N个字符创建索引.N的最大取值和存储引擎有关,MyIASM支持最 ...