美文网首页
前端-03day-选择器及优先级&字体样式颜色

前端-03day-选择器及优先级&字体样式颜色

作者: crx彭彭 | 来源:发表于2018-10-18 10:32 被阅读0次

    通配选择器 : *
    选择页面上的所有元素
    复合选择器 (交集选择器)
    既满足,又满足 什么下的什么 span.p3
    子元素和后代元素选择器
    祖先和后代的关系
    后代元素选择器空格
    div span
    子元素选择器
    div>span
    伪类选择器
    特殊的状态
    只能设置字体的颜色
    a:link (没访问过的)
    a:visited (访问过的)
    a:hover (鼠标移入时的样式)
    a:active (鼠标点击时的样式)
    focus (获取焦点) 鼠标在文本框点击时
    before (指定元素前)
    after (指定元素后)
    ::selection (选中的元素) 选中时 -moz-火狐认识
    <input type="text"> 文本输入框
    伪元素 表示特殊的位置
    :first-letter 首字母
    :first-line 首行
    :before 出现在段落最前面 和content一起使用
    :after 出现在段落最后面 和content一起使用

    属性选择器
    tiele 属性 可以给任何标签指定
    p[title="hello"]{
    background-color: yellow;
    }
    p[title]{
    background-color: yellow;
    }
    p[title^="ab"]{
    background-color: yellow;
    }以什么开头的
    p[title$="c"]{
    background-color: yellow;
    }以什么结尾的
    p[title*="b"]{
    background-color: yellow;
    }包含什么的

    子元素选择器
    :first-child 表示第一个 必须是第一个子元素才行
    :last-child 表示第最后一个 必须是最后子元素才行
    :nth-child(数字) 可以选择第几行 even (偶数) odd(基数)
    :first-of-type 所有的同类都可以

    兄弟元素选择器
    span+p span后一个兄弟元素选择器 紧挨着
    span~p span后面所有的p元素
    否定伪类
    p:not(.hello) 除了它都变黄
    样式的继承
    它的子孙会继承它的样式
    字号会继承
    背景相关的样式不会被继承

    选择器的优先级
    !important 最高的
    内联样式,优先级1000
    id选择器 优先级100
    类和伪类 优先级10
    元素选择器 优先级1
    通配 * 优先级0
    继承的样式 没有优先级
    如果优先级一样,选择靠后的
    并集选择器
    各算各的
    a的伪类
    a:link (没访问过的)
    a:visited (访问过的)
    a:hover (鼠标移入时的样式)
    a:active (鼠标点击时的样式)
    link visited hover active 顺序
    文本标签
    em 语气 斜体
    strong 警告 加粗
    i 斜体 i-->icon(小图标)
    b 加粗
    small 变小
    big 变大
    cite 表示一个参考的内容
    q 代表一个行内引用 加"" 短引用
    blockquoke 长引用 块 换行
    sup 上标 次方
    sub 下标
    ins 插入 下划线
    del 删除 删除线
    code 专门用来保存代码
    pre 保留想要格式 不会忽略空格和换行
    code和pre一起用
    自动跳到顶部
    <p id="p1"></p> <a href="#p1"> 跳转到指定位置
    列表
    1.无序列表 < ul > li(列表项) 去掉项目符号 ul{ list-style:none;}
    li 是块元素
    ul 是块元素
    2. 有序列表 <ol> li(列表项) <ol type="i,I,1,A,a">
    *3. 定义列表 *<dl> 子标签<dt> 定义的内容描述 <dd>

    1em = 1font-size
    颜色 rgb(0~255) %三个都是100%是色白大 三个都是0%是黑色 0最小 #aabbcc 简写#abc
    字体的样式
    font-family:定义字体
    font-size:50px; 字体大小
    font-family:华文彩云,arial,微软雅黑;
    font-style:italic; 斜体
    font-weight:bold; 粗体
    font-variant: small-caps;小型大写字母
    简写:font: italic small-caps 50px 华文彩云; 字体放最后一个

    相关文章

      网友评论

          本文标题:前端-03day-选择器及优先级&字体样式颜色

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