CSS定位走一波(定位学习续)
来源:互联网 发布:网络促销方案模板 编辑:程序博客网 时间:2024/06/05 19:44
又是新的一周过去了,时间到了,春天绿了,关于HTML5的学习进步了,今天博客更新一些CSS定位的内容,小的一些细节也要牢记,方便做一个更完美的项目。
如何让垂直方向居中,解决方式:在父元素添加overflow:hidden
为父盒子添加border
为父盒子添加border
上下两个并排内容块的安排,最好只设置其中每个块上或下margin的一处即可
CSS的box-sizing
content-box:采用标准模式解析计算,也是默认模式
border-box:将采用怪异模式解析计算
采用相对定位的元素,会相对于它原来的位置进行定位并且,元素原始占用的空间不会被其他元素占用
采用绝对定位的元素,会寻找离它最近的采用了定位的父元素,并以它为坐标进行定位。如果所有的父元素都没有使用定位,则以body为坐标进行定位。并且,元素占用的空间会被其他元素占用
在CSS中的文档机制
普通文档流
浮动
定位
除非专门指定,否则所有框都在普通流中定位。
块级框从上到下一个接一个地排列。
CSS 定位属性position
static
relative
absolute
fixed
CSS其他定位属性
top
right
bottom
left
z-index
CSS相对定位position取值为relative
CSS相对定位是元素与元素原来的位置
CSS相对定位元素仍占据原来的空间
CSS绝对定位position取值为absolute
CSS绝对定位的元素是相对最近的已经定位的祖先元素,如果没有定位的祖先元素,那么相对于初始包含块(body)
CSS固定定位position取值为fixed
CSS负边距是布局中常用的技巧,合理的运用会有意想不到的效果
垂直居中=绝对定位+负边距
负边距会增加元素的宽度,该元素会省略宽度
并集选择器:#left,#center,#right
水平排放的盒子,水平间距是margin的累加
垂直排放的值,垂直间距是合并的(取最大值)
- CSS定位走一波(定位学习续)
- css学习之定位
- CSS学习笔记--定位
- CSS定位学习笔记
- CSS定位学习
- css学习之定位
- css基础学习----定位
- 学习笔记-CSS定位
- CSS的定位(绝对定位 相对定位 固定定位)
- css定位(相对定位、绝对定位、固定定位)
- css学习绝对定位、相对定位
- CSS学习8(浮动和定位)
- CSS学习笔记-position定位(九)
- CSS学习笔记(二)--CSS框模型/CSS定位
- CSS定位(position)
- css定位(positioning)
- CSS 定位(Positioning)
- CSS-Positioning(定位)
- Log4J使用
- lightRNN论文阅读笔记
- PHP 遇到问题合成图片时 需要返回参数 报错的情况
- c3p0 APPARENT DEADLOCK问题
- 【Inno Setup】设置控制面板中的程序卸载的图标
- CSS定位走一波(定位学习续)
- Mysql数据库mysql-5.7.18-winx64安装笔记(补充版)
- 文章标题
- Linux 下如何进入 MySQL 命令行
- PIL的安装
- ORA-28000: the account is locked-的解决办法
- ios控制器之间传值-属性传值(正向传值)
- Android的权限动态申请需要注意的地方
- 对java类进行初始化设置,默认设置String类型为空串""