Css笔记Day08

一、浮动

1、清除浮动语法: 选择器{clear:属性值}

属性值:right:不允许右侧有浮动(清除右侧浮动影响);

left:不允许左侧有浮动元素(清除左侧浮动的影响);

both:同时清除左右两侧的浮动;

2、清除浮动的四种方法:

1) 使用空标记清除浮动;

2)使用overflow属性清除浮动

3) 使用after伪对象清除浮动

4)使用before after伪对象清除浮动

二、元素定位

语法: 选择器{position:属性值}

static:自动定位(默认定位方式)

relative:相对定位,相对于其原文档流的位置进行定位

absolute:绝对定位,相对于其上一个已经定位的父元素进行定位

fixed:固定定位,相对于浏览器窗口进行定位

边偏移定位:

top顶端偏移量,定义元素相对于其父元素上边线的距离

bottom底部偏移量,定义元素相对于其父元素下边线的距离

left左侧偏移量,定义元素相对于其父元素左边线的距离

right右侧偏移量,定义元素相对于其父元素右边线的距离

绝对定位的特性:

包裹性:根据实际内容来撑开绝对定位元素的大小。

破坏性:导致父容器塌陷,由于脱离了文档流,导致父容器塌陷。

悬浮性:会漂浮起来,在原始流的元素之上。


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,809评论 1 92
  • 1.CSS基本概念 1.1 CSS的定义 CSS(Cascading Style Sheets)层叠样式表,主要用...
    寥寥十一阅读 1,875评论 0 6
  • 浮动 CSS允许浮动任何元素。 浮动元素 首先,会以某种方式将浮动元素从文档的正常流中删除,不过它还是会影响布局。...
    exialym阅读 1,251评论 0 6
  • 1.盒模型是CSS的基石之一,它指定元素如何显示以及(在某种程度上)如何相互交互。页面上的每个元素被看作是一个矩形...
    garble阅读 554评论 0 0
  • 浮动元素有什么特征?对父容器、其他浮动元素、普通元素、文字分别有什么影响? 特征: 脱离正常文档流,沿其容器的左侧...
    _Dot912阅读 738评论 0 3