css基础记忆

标签：内联   add   city   十六进制   透明   嵌套   tom   标签   before   

‘‘‘
CSS
   style
   link rel="stylesheet" href="css"
   style

    基本选择器
        #id .class TogName *
    组合选择器
        x y/x > y/x + y/x ~y
    属性选择器
        x[a/a=b/a^=b/a$=b/a*=b/a~=b]
    伪类选择器
        :link
        :active
        :hover
        :visited
        :focus
    伪元素选择器
        :first-letter
        :before
        :after
    选择器的优先级
        内联样式1000>id选择器100>class10>元素1>继承0

分组、嵌套、继承
    a,
    b,
    c,
    ...{
    }
    TagName #id {
    }
    body {
        color: red;
    }
    在body内的所有后代都将继承body的color属性，但是权重贼低0
    有些属性无法继承：
        border, margin, padding, background等

属性相关
    height/ width 只能对块级标签有效
    字体属性
        font-family
        font-size
        font-weight:
            normal bold bolder lighter 100-900 inherit
        color: 颜色名称 #十六进制  RGB(,,,透明度)
    文字属性
        text-align
            left/right/center/justify
        text-decoration
            none
            underline
            overline
            line-through
            inherit
        text-indent: px
    背景属性
        font-style:italic;">        background-image: url("")
        background-repeat:repeat/no-repeat/repeat-x/repeat-y
        background-position:left top
            left/right/top/bottom/center
        background-attachment: fixed
    边框
        border-color:
        border-width:
        border-style:
            none dotted dashed solid
        border-radius: %
    display
        none    visibility: hidden
        block
        inline
        inline-block

盒子模型
    margin: 标签之间的间隔
    border: 标签本身空间的边框
    padding: 文本距离标签边框的距离
    content: 文本内容

    margin-left/right/top/bottom
    padding-left/right/top/bottom
    上右下左

    float:left/right/none
    clear:left/right/both/none/inherit

    父级标签塌陷问题：
        当子标签设置浮动属性后，会脱离文档流，从而浮动于父类之上，父类无法根据浮动子类的大小来自动扩展
        从而导致父类标签塌陷问题
        解决方法：
            1. 给子标签增加
                after {
                    content: "";
                    clear: both;
                    display:inline;
                }
            2. 给子标签后面加
                <span style="clear:both">
            3. 给父标签设置
                display: inline-block
            4. 给父标签设置
                overflow: hidden
            5. 给父标签设置高度为浮动子标签高度
    overflow:
        -x -y
            visible
            hidden
            scroll
            auto
            inherit
    position
        static
        relative
        absolute
        fixed

    z-index: int
        设置index的永远压着没有设置index的
        父亲怂了儿子再牛也没用
        只有定位了才能使用index
        值大为优
    opacity: 透明度 0-1




‘‘‘

css基础记忆

标签：内联   add   city   十六进制   透明   嵌套   tom   标签   before   

原文地址：https://www.cnblogs.com/zhangzhuowei/p/14877899.html