zoukankan      html  css  js  c++  java
  • CSS学习笔记(float和盒子模型)

    1、当元素或者是它的包裹层设置了绝对定位或者是浮动,那么margin:0 auto;自动居中的效果就不会实现。

    2、盒子模型的三位立体结构图中从第一层到第五层依次为:border、content+padding、background-image、background-color、margin。

    3、

    设置了浮动属性(float)的元素:
    1、会向指定方向(left或right)一直移动,直到容器边缘;
    2、处于标准文档流中;
    3、若不设置宽高,则以内容的宽高为准;
    4、仅对紧邻的后续元素造成影响;

    4、
    清除浮动的常用方法
    1、clear属性-常用clear:both;
    2、clear:left,或者clear:right; 清除元素左侧或右侧的浮动 3、同时设置width:100%(或固定宽度)+overflow:hidden;也是可以清除浮动的。一般给受到浮动的元素设定的。 p{100%; overflow:hidden}或p{width:both}
    4、在浮动元素的紧邻后续块元素之前加一个空标签(不推荐使用)
    如果父包含层没有设置浮动,子包含层设置浮动,会对子包含层的父包含层和父包含层后面的会计元素产生影响!!所以要对父包含层设置清除浮动影响。
    当父包含快缩成一条是,用clear:both清除浮动方法是无效的,clear:both一般用于紧邻后面的元素的清除浮动。
    这种情况使用overflow:hidden会有效,
    overflow:hidden 用来清除影响float对父级元素的浮动影响
    clear:both;用来清除float对后面元素的浮动影响
    5、隐形改变display的类型:不管是什么类型的元素,只要设置其样式为:position:absolute;float:left/right后dispaly就变为了inline-block;这样就可以设置宽高了。
     
  • 相关阅读:
    关于gitlab怎样merge request的流程
    有访问权限的gitlab如何把上面的代码clone到本地
    macpro终端打开mysql
    Hbase实验:java创建和删除table
    齐次递推式拆数学式
    一些生成函数
    圆锥表面曲线方程
    扩展欧拉降幂
    scanf读入有空格字符串
    线性筛素数的一个用途
  • 原文地址:https://www.cnblogs.com/fireporsche/p/6185288.html
Copyright © 2011-2022 走看看