css中的定位和框模型问题
和定位有关的元素属性如下
position 元素的定位类型
绝对定位会相对于最近定位的祖先元素的位置来定位,而不会影响其他框的位置
固定定位
相对定位
z-index 元素的堆叠顺序 值越大越靠上
left right top bottom 只有当position设置的时候才起作用
框模型
overflow 元素是否溢出
visibility 元素是否可见的
display 框模型定义 行内框 行内块级框 块级框 不显示 四种模式
widht height
margin padding 外边距 内边距
border 边框
虽然display设置成none和visibility设置成hidden都是元素不可见,但是display的设置会是元素消失且不占页面位置,而visibility则会占页面位置
背景
background-position:left bottom;
background-repeat:no-repeat;
background-color:black;
background-image:url("star.gif");
background-attachment:scroll;
简写模式
background:none transparent repeat left top scrool;
css中的定位和框模型问题的更多相关文章
- CSS中的定位与浮动
CSS中的定位与浮动 本文主要讲述CSS中的三种定位样式static.relative和absolute的区别以及浮动元素的特征. 定位样式 CSS中定位样式position的取值有三个,默认值:st ...
- 关于CSS中的定位使用子绝父相(子类绝对位置和父类相对位置)
关于CSS中的定位使用子绝父相(子类绝对位置和父类相对位置) 欢迎转发,但是请填写原博客地址https://www.cnblogs.com/JNovice/p/9536910.html 前言:最近在 ...
- css中的定位属性position(转)
css中的定位属性position 同样的也是上课的时候发现学生难以理解的一些问题拿出来记录一下,希望帮助初学者. 在css中定位属性position的运用在页面中是很常用的,特别是一些结合js来 ...
- CSS中的定位机制
CSS3 中有三种定位机制 : 普通文档流 (text)| 浮动(float) | 定位(position) 普通文档流 就是CSS中默认的文本文档 普通流中,元素位置由文档顺序和元素性质决定,块级元 ...
- 总结一下CSS中的定位 Position 属性
在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...
- [转]总结一下CSS中的定位 Position 属性
在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...
- css中元素定位
在html中网页可以看成一个立体的空间,一个完整的页面是由很多个页面堆积形成的,如下图所示 CSS中Position属性有四个可选值,它们分别是:static.absolute.fixed.relat ...
- css中的定位
上一篇博客,我大概介绍了下浮动的使用及行为.其实在整个文档布局中,定位也对我们整个的页面排版有非常好的帮助,当然前提是使用得当. 一.定位分类: a.静态定位 position:static; ...
- 对css中的定位属性postion刨根解牛
定位的基本思想很简单: 它允许你定义元素框相对于其正常位置应该出现的位置(relative),或者相对于父元素(absolute).另一个元素甚至浏览器窗口本身的位置(fixed).显然,这个功能非常 ...
随机推荐
- MD5 加密的两种方法
System.Security.Cryptography.MD5CryptoServiceProvider md5 = new System.Security.Cryptography.MD5Cryp ...
- CodeBlocks16.01+wxWidgets3.0.2
[环境] windows7 x64,CodeBlocks16.01,wxWidgets3.0.2 [步骤] 一.下载所需的文件: 1.codeblocks官网:http://www.codeblock ...
- Jquery实现ready()的源码
function bindReady(){ if ( readyBound ) return; readyBound = true; // Mozilla, Opera and webkit nigh ...
- VMware三个版本workstation、server、esxi的区别
VMware三个版本 workstation: 单机级,用在个人桌面系统中,需要操作系统支持 servier:工作组级,用于服务器,需要操作系统支持 esxi:企业级,用于服务器,不需要操作系统支持 ...
- 移动端前端框架UI库(Frozen UI、WeUI、SUI Mobile)
Frozen UI 自述:简单易用,轻量快捷,为移动端服务的前端框架. 主页:http://frozenui.github.io/ 开发团队:QQVIP FD Team Github:https:// ...
- 在Sharepoint2010中一种自定义调查列表的不允许再次答复提示的处理方法!
在Sharepoint中默认创建的调查列表系统只允许答复一次,再次答复将报错误信息,这对最终用户而言是非常不友好的体验,当然你也可以在调查设置中的常规设置中设置允许多次答复,这样就会有错误提示信息,但 ...
- 2^x mod n = 1(欧拉定理,欧拉函数,快速幂乘)
2^x mod n = 1 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Tot ...
- JavaScript进阶内容1:各种对象类型判断
该文章主要用来介绍JavaScript中常用的一些对象检测判断方法,整理资源来自书本和网络,如有错误或说明不详之处,望评论提出,本菜定提名感谢……(本文章知识比较基础,大牛请提些意见再绕道,三克油^_ ...
- spring源码分析之spring-web remoting模块概况及基本概念
spring-web总体分为三部分:caucho.httpinvoker.jaxws,其总体构造图如下: uml结构: 先看看网上搜索到的上述实现的原理吧:Spring RMI,Hessian/Bur ...
- eclispe使用外部tomcat总结
1. 配置tomcat Servers-->new 配置tomcat的路径,即可 2. 增加/移除application 注意:移除application时请使用"clean" ...