CSS(一)选择器

143 阅读1分钟
  1. 样式的三种方式:
  • 内联样式
<div style="width:100px;height:100px;color: red">123456</div>
  • 内部样式
<style>
     p{
          color: green;
        }
</style>
<p>1234567890</p>


  • 外部样式
 <link rel="stylesheet" href="./index.css">
  1. 选择器:
  • id选择器 #id名{}
  • class选择器 .class名{}
  • 标签选择器 标签名{}
  • 子代选择器 A>B
  • 后代选择器 A空B
  • 伪类选择器 a:hover{}一般是鼠标划入时有变化
  • 分组选择器 A,B{}
  1. 选择器的优先级:
  • !important 1000000(一般情况下不建议使用,破坏代码的稳定)
  • 内联1000
  • id 100
  • class 伪类 10
  • 标签 伪元素 1
  • 同一个元素的相同属性优先级:id > class > 标签
  • 同一个元素,不同选择器里的不同属性会合并
  • 同一个元素,选择器的优先级相同时 同一个属性 后面的会把前面的覆盖