• CSS进阶(一)width & height


    禁用默认行为可以使拖动行为更加流畅,如a标签

    块级元素不是指拥有display:block声明的元素

    块级元素具有的换行特性,它们都可以使用clear来清除浮动带来的效果

    display:inline-block实际上是两个容器,外在容器负责布局,内在容器负责大小

    width深入

    inline-block 浮动元素 绝对定位元素都有智能的包裹性

    首选最小宽度

    width设置为0时,图片和文字的权重大于布局

    (1)东亚文字显示为单个最小文字的宽度

    (2)西方文字特定的最小宽度由英文字符单元决定。一般终止于空格,短横线(-),问号及其他非英文字符

    (3)图片的最小宽度就是该元素本身的宽度

    width设置了具体的宽度后就丧失了流动性

    height

     width和height作用在content-box上

    margin的背景永远是透明的

    ie8box-sizing属性需要带前缀

    对于普通文档流中的元素,百分比高度要想起作用,其父级必须有一个可以生效的高度值

    css渲染的方式是先渲染父元素,后渲染子元素

    元素支持height:100%的方法

    (1)设置父级元素的宽度,高度为父元素的content-box的高度

    html,body{
      height:100%;
    }

    (2)设置元素的绝对定位,高度为父元素的padding-box的高度

    div{
      position:absolute;
      height:100%;
    }

     max-width会覆盖width属性,超越!important的权重

    min-width和max-width冲突时,min-width会覆盖max-width

    min/max-width/height是为流体而生的

    展开收起的动画可以由max-height/width来实现

  • 相关阅读:
    Git与GitHub的基本使用
    HTML&CSS基础-外边框
    HTML&CSS基础-内边框
    SHELL脚本编程变量输入
    GoLang基础数据类型-切片(slice)详解
    GoLang基础数据类型--->数组(array)详解
    SHELL脚本编程的运算符
    SHELL脚本编程变量详解
    HTML&CSS基础-边框简写属性
    GoLang基础数据类型--->字符串处理大全
  • 原文地址:https://www.cnblogs.com/goOtter/p/9697411.html
Copyright © 2020-2023  润新知