css基础

块级元素和行内元素

https://www.cnblogs.com/peng-yan/p/5428324.html

选择器

  • 简单选择器

1、元素选择器,p标签,div标签等
2、类选择器,类选择器由一个点“.”以及类后面的类名组成。

  • Create an HTML document
  • .first { font-weight: bold; }

    3、id选择器 #

    — "Good morning."

    #polite { font-family: cursive; }

    4、通用选择器 *
    https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Introduction_to_CSS/Simple_selectors

    • 属性选择器:通过属性/属性值匹配一个或多个元素。
      https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Introduction_to_CSS/Attribute_selectors

    • 伪类:匹配处于确定状态的一个或多个元素,比如被鼠标指针悬停的元素,或当前被选中或未选中的复选框,或元素是DOM树中一父节点的第一个子节点。
      常见伪类 :hover,:link,:active,:target,:not(),:focus

    • 伪元素:匹配处于相关的确定位置的一个或多个元素,例如每个段落的第一个字,或者某个元素之前生成的内容。
      常见伪元素:::first-letter,::first-line,::before,::after,::selection注意双冒号。

    • 组合器: 这里不仅仅是选择器本身,还有以有效的方式组合两个或更多的选择器用于非常特定的选择的方法。例如,你可以只选择divs的直系子节点的段落,或者直接跟在headings后面的段落。
      https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Introduction_to_CSS/Combinators_and_multiple_selectors

      组合选择器

    • 多重选择器:这些也不是单独的选择器;这个思路是将以逗号分隔开的多个选择器放在一个CSS规则下面, 以将一组声明应用于由这些选择器选择的所有元素。

    背景

    background-color
    background-image
    background-position 指定背景应该出现在元素背景中的位置。
    background-repeat
    background-attachment 当内容滚动时,指定元素背景的行为,例如,它是滚动的内容,还是固定的?

    层叠和继承

    选择器 千位 百位 十位 个位 合计值
    h1 0 0 0 1 0001
    #indentifier 0 1 0 0 0100
    h1 + p::first-letter 0 0 0 3 0003
    li > a[href*="zh-CN"] > .inline-warning 0 0 2 2 0022
    没有选择器, 规则在一个元素的