CSS定位笔记

1、定位参照与谁块来决定
没有定位:包含块
相对定位:元素原来位置
绝对定位:包含快(如果最近的祖先元素存在定位元素,则这个定位元素就是包含快;如果没有,包含块为初始包含块)
固定:视窗
2、什么是初始包含块
是一个视窗大小的矩形,不等于视窗
3、初始值和可继承性
3.1、属性:left、top、right、bottom、width、height
默认值:auto,不可继承
3.2、属性:margin、padding
默认值:0
3.3、属性:boder-width
如果不存在boder-style不存在值
4、属性的百分比
width、margin、padding:包含块的width
height:包含块的height
top:包含块的height
left:包含块的width
5、浮动
浮动提升元素半层
6、三列布局
定义:
  两边固定,当中自适应
  中间列要完整显示
  中间列要有限加载
实现:定位、浮动、圣杯、双飞翼
7、margin为负值(margin不影响元素的位置)
负值:将元素的边界往里收
正值:将元素的边界往外扩
8、伪等高布局
9、fixed
9.1、怎么使用绝对定位来模拟固定定位
1.禁止系统滚动条
2.将滚动条加给body
3.将body的尺寸变为视口的尺寸
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,840评论 1 92
  • 1. 前言 前端圈有个“梗”:在面试时,问个css的position属性能刷掉一半人,其中不乏工作四五年的同学。在...
    YjWorld阅读 4,598评论 5 15
  • 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握CSS三种显示...
    七彩小鹿阅读 6,356评论 2 66
  • 一、定位 1.相对定位 position:relative,相对于原来的位置偏移。偏移后不影响原有的布局. 2.绝...
    Stevenqqq阅读 279评论 0 0
  • 现在90后已经成为很多公司的主力军,让我们来聊聊这些90后们。 我们不能一味用以自我为中心来评价90后这个团体,毕...
    茵子ab阅读 179评论 0 0