css select

CSS Select 是一个很实用且高效的选择器，用于针对 HTML 页面元素进行样式编辑。CSS Select 包括简单选择器、关系选择器、属性选择器和伪类选择器等多种类型。

/* 简单选择器 */

/* 标签选择器 */
p {
  color: red;
}

/* 类选择器 */
.my-class {
  background: blue;
}

/* ID 选择器 */
#my-id {
  font-size: 16px;
}

/* 关系选择器 */

/* 子选择器 */
ul > li {
  list-style: none;
}

/* 相邻兄弟选择器 */
div + p {
  margin-top: 10px;
}

/* 后代选择器 */
ul li {
  color: green;
}

/* 属性选择器 */

/* 具有某个属性的元素选择 */
input[type="text"] {
  border: 1px solid black;
}

/* 具有特定属性或值的元素选择 */
a[href] {
  color: purple;
}

/* 以某个字符串开始、结尾或包含的属性选择器 */
[data-name^="someone"] {
  background: yellow;
}

/* 伪类选择器 */

/* 动态伪类 */
a:hover {
  color: orange;
}

/* 位置伪类 */
li:nth-child(odd) {
  background: gray;
}

/* 目标伪类 */
:target {
  color: pink;
}

以上是 CSS Select 的一些基本用法和示例，适当使用可以有效提高代码的可维护性和可读性。