zoukankan      html  css  js  c++  java
  • CSS那些事笔记(一入门)

    CSS作用

    1. 修饰页面,避免不必要的HTML元素
    2. 更有效地控制页面结构、布局
    3. 提高开发和维护效率

    CSS基本结构

    selector {property:value;}

    CSS中的注释

    /*版本版权*/
    
    body
    {
        color:#FF0000;
        ...
    }
    /*将<body></body>的样式定义为...*/
    

    CSS中的简写

    颜色:#FFFFFF,#FFF,RGB(255,255,255),RGB(100%,100%,100%),black

    单位:数值为0时单位可省略

    内外补丁:value1,所有边都一样;value1,value2,上下1,左右2;value1,value2,value3,上1左右2下3;value1,value2,value3,value4,上右下左

    边框:width,style,color (boder:1px solid,#FFFF00)

    CSS中的选择器

    * 通配符

    .class 类选择符

    a b 包含选择符(派生选择符,后代选择符),包含在a选择符中的b选择符

    a > b 子选择符,a儿子节点中的b选择符

    a + b 相邻选择符,同父元素下,与a之后的b选择符

    E[attr],E[attr="value"],E[attr~="value"],E[attr|="value"],属性选择符,分别指:具有attr属性,attr属性指为value,attr属性值为被空格隔开且存在value,attr属性值以value开始后面用横字符隔开

    ID选择符

    CSS中的伪类

    :link,:visited,:hover,:avtive,

    CSS中的伪对象

    :before,:after,

    CSS中的覆盖、继承、优先级别

    优先级别由高至低:

    1. 标有!important关键字声明的属性
    2. HTML中的样式属性
    3. 作者编辑的样式文件
    4. 用户设置的样式
    5. 浏览器的默认样式
    优先积分:
    • 标签选择符、伪类:1分
    • 类选择符、属性选择符:10分
    • Id:100分
    • Style:1000分
    • 其他,如通配符:0分
    • !important 其他的均被覆盖
    注:本读书笔记应用《CSS那些事——掌握网页样式与CSS布局核心技术》



    苦逼码农一个,
    人力资源管理专业本科毕业,
    懂点c#,
    懂点javascript,
    懂点sql,
    懂点设计模式
    ...

    @我是赵六六

    q:329952402

  • 相关阅读:
    【Rust】结构体 struct
    【Rust】所有权、引用、借用
    Centos7升级glibc2.24
    ES用户权限控制
    PHP压缩html网页代码 : 清除空格,制表符,注释标记
    PHP通过HTTP_USER_AGENT判断是否为手机移动终端的函数
    php正则表达式替换URL链接地址为指定url的形式
    PHP下使用CURL方式POST数据至API接口的方法
    设计模式代理模式
    设计模式生成器模式
  • 原文地址:https://www.cnblogs.com/acjialiren/p/2120457.html
Copyright © 2011-2022 走看看