Web基础_css核心

margin：垂直方向上会出现外边距合并，以大的为准

样式优先级：内联样式 > id选择器 > 类选择器 > 标签选择器

相对定位：相对于自己原先的位置定位，不脱离文档流

绝对定位：相对于父元素定位，脱离文档流，不受父元素padding影响

固定定位：相对于视口定位，脱离文档流，使用 bottom、top等定位

css有 id选择器、标签选择器、类选择器，组合这些选择器可采用下面的方式：

• 子选择器：div > p { text-align: center; }

• 后代选择器：div p { text-align: center; }

• 并集选择器：div, .fix-box {text-align: center; }，类似于sql中的or

display控制元素显示方式：

• display：block，块级元素
• display：inline，行内元素
• display：inline-block，行内块元素，既可以在一行显示又可以设置宽和高

伪类

• :hover、:nth-child(n)

  a:hover {
    color: red;
  }
  
  ul li:nth-child(2) {
    color: green;  /* 选择第二个 <li> 元素 */
  }
  

伪元素：

• ::before：在元素的内容之前插入内容

• ::after：在元素的内容之后插入内容

  p::after {
    content: "你好";  /* 在每个<p>元素的内容之后插入你好 */
  }