当前位置 博文首页 > 文章内容

    07 Float浮动、CSS定位(position)

    作者: 栏目:未分类 时间:2020-09-07 14:00:51

    本站于2023年9月4日。收到“大连君*****咨询有限公司”通知
    说我们IIS7站长博客,有一篇博文用了他们的图片。
    要求我们给他们一张图片6000元。要不然法院告我们

    为避免不必要的麻烦,IIS7站长博客,全站内容图片下架、并积极应诉
    博文内容全部不再显示,请需要相关资讯的站长朋友到必应搜索。谢谢!

    另祝:版权碰瓷诈骗团伙,早日弃暗投明。

    相关新闻:借版权之名、行诈骗之实,周某因犯诈骗罪被判处有期徒刑十一年六个月

    叹!百花齐放的时代,渐行渐远!



    float: left | right | none | inherit;(只能左右浮动,不能上下浮动)
    float特征:
    块在一排显示
    内联支持宽高
    默认内容撑开宽度
    脱离文档流
    提升层级半层
    clear清除浮动:
    clear : left | right | both | none | inherit; (元素的某个方向上不能有浮动元素)
    clear : both; (在左右两侧均不允许浮动元素)
    清除浮动的方法:
    加高(问题:扩展性不好)
    父级浮动(问题:页面中所有元素都加浮动,margin左右自动失效)
    inline-block 清除浮动方法(问题:margin左右auto失效)
    空标签清浮动(问题:IE6最小高度19px;(解决后IE6下还有2px偏差))
    br 清除浮动(问题:不符合工作中:结构、样式、行为,三者分离的要求)
    after伪类 清除浮动方法:给元素尾部添加内容或者zoom缩放(触发IE下 haslayout,使元素根据自身内容计算宽高,FF不支持)
    overflow:hidden 清除浮动(问题:需要配合宽度或者zoom 兼容IE6、IE7)
    (overflow: scroll | auto | hidden; overflow: hidden;溢出隐藏)
    CSS定位:
    只有position属性值为relative、absolute、fixed才可以使用,top、right、bottom、left属性。
    static静态定位(不对它的位置进行改变)
    fixed固定定位(参照物—浏览器窗口)——做弹窗广告用(生成固定定位的元素,相对于浏览器窗口进行定位)
    relative相对定位(参照物以他本身)(生成相对定位的元素,相对于其正常位置进行定位)
    absolute(绝对定位)(除了static都可以,找到参照物,与它最近的已经有定位的父元素进行定位)(生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位)