CSS

作者: 马梦里 | 来源:发表于2017-12-09 08:26 被阅读0次
    • display 属性

      • none
      • block
      • inline
      • inline-block
    • none 不显示

    • block 占一行

      • 默认 block 的标签有
      • div p ul ol li h1 h2 h3 h4 h5 h6
    • inline 只占 content 的尺寸
    • inline-block
      • inline-block 是 inline 布局 block 模式
      • inline-block 对外表现为 inline,所以可以和别的 inline 放在一行
      • 对内表现为 block,所以可以设置自身的宽高
    • position 属性用于元素定位

      • static 默认定位
      • relative 相对定位, 相对于自己本来应该在的位置
      • absolute 绝对定位, 行为有点奇怪
      • fixed 固定定位, 相对位置是整个窗口
    • 非 static 元素可以用 top left bottom right 属性来设置坐标

    • 非 static 元素可以用 z-index 属性来设置显示层次

    • relative 是相对定位

    • absolute 完全绝对定位, 忽略其他所有东西相对于(相对于页面,有页面滚动条时,随滚动条滚动)

      • 往上浮动到 非 static 的元素
    • fixed 基于 window 的绝对定位

      • 不随页面滚动改变
    • overflow 属性

      • visible 默认
      • auto 需要的时候加滚动条
      • hidden 隐藏多余元素
      • scroll 就算用不着也会强制加滚动条

    选择器优先级:

    • !import:最高级别
    • 内联样式
    • id选择器
    • class选择器
    • 元素选择器

    display:

    • block 以块显示
    • none 不显示
    • inline 放在一起(清除块)
    • inline-block

    positive

    • static 默认定位
    • relative 相对于自身的定位,通过topleft来调整,不会改变页面布局(悬空调整)
    • absolute 绝对位置,会浮动,指导找到非static的父元素,top left right来调整,随滚动条滚动。
    • fixed 基于windows的,不随滚动条滚动;

    overflow

    • visible 默认,显示全部
    • auto 需要的时候加滚动条
    • bidden 设置长宽后,隐藏多余的元素
    • scroll 强制加滚动条

    相关文章

      网友评论

          本文标题:CSS

          本文链接:https://www.haomeiwen.com/subject/ltkuixtx.html