CSS样式

!important

!important 规则用于增加样式的权重:!important 与优先级无关，但它与最终的结果直接相关，使用一个 !important 规则时，此声明将覆盖任何其他声明。
详情：https://www.runoob.com/css/css-important.html

HTML DOM querySelector() 方法 - 返回文档中匹配指定 CSS 选择器的一个元素

(1)querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。

注意： querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素，请使用 querySelectorAll() 方法替代。

详见：https://www.runoob.com/jsref/met-document-queryselector.html

指定在指向元素时要显示的鼠标光标 - cursor

详见：https://www.jc2182.com/css/css-cursor-prop.html

@media规则

(1) 定义和用法:@media 规则在媒体查询中用于为不同的媒体类型/设备应用不同的样式。

媒体查询可用于检查许多事情，诸如：

• 视口的宽度和高度
• 设备的宽度和高度
• 方向（手机或平板电脑处于横屏还是竖屏模式？）
• 分辨率
  使用媒体查询是一种流行的技术，用于向台式机、笔记本电脑、平板电脑和手机提供定制的样式表（响应式网页设计）。

您还可以使用媒体查询来规定某些样式仅适用于打印的文档或屏幕阅读器（mediatype：print、screen 或 speech）。

除了媒体类型之外，还有媒体特性。媒体特性通过允许测试用户代理或显示设备的具体特性，为媒体查询提供了更多特定细节。例如，您可以将样式仅应用于大于或小于特定宽度的屏幕。

(2) CSS语法：

@media not|only mediatype and (mediafeature and|or|not mediafeature) {
  CSS-Code;
}

举例：

//调整浏览器窗口大小,文档的宽度为 600 像素或更小，背景颜色为“浅蓝色”，否则为“黄色”。
@media only screen and (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}

更多详见:https://www.w3school.com.cn/cssref/pr_mediaquery.asp

文本

CSS字体样式

总结：详见http://c.biancheng.net/css3/font.html

• font-family：设置字体；
• font-style：设置字体的风格，例如倾斜、斜体等；
• font-weight：设置字体粗细；
• font-size：设置字体尺寸；
• font-variant：将小写字母转换为小型大写字母；
• font-stretch：对字体进行伸缩变形（使用较少，并且主流浏览器都不支持）；
• font：字体属性的缩写，可以在一个声明中设置多个字体属性。
  详见：http://c.biancheng.net/css3/font.html

CSS文本格式化

通过 CSS 中的文本属性您可以像操作 Word 文档那样定义网页中文本的字符间距、对齐方式、缩进等等，CSS 中常用的文本属性如下所示：

• text-align：设置文本的水平对齐方式；
• text-decoration：设置文本的装饰；
• text-transform：设置文本中英文的大小写转换方式；
• text-indent：设置文本的缩进方式；
• line-height：设置行高；
• letter-spacing：设置字符间距；
• word-spacing：设置单词与单词之间的间距（对中文无效）；
• text-shadow：设置文本阴影；
• vertical-align：设置文本的垂直对齐方式；
• white-space：设置文本中空白的处理方式；
• direction：设置文本方向。

扩展 - 文本修饰 - text-decoration

(1)text-decoration属性是text-decoration-line，text-decoration-style和text-decoration-color的简写属性。
text-decoration简写属性：

• text-decoration-line (必需的)
• text-decoration-color
• text-decoration-style
  详见:https://www.jc2182.com/css/css-text-decoration-prop.html
  (2) text-decoration-line属性设置要使用的文本修饰类型（如下划线，上划线，直线）
  详见：https://www.jc2182.com/css/css-text-decoration-line-prop.html
  (3) text-decoration-color属性指定文本修饰的颜色（下划线，上划线，直线）
  详见：https://www.jc2182.com/css/css-text-decoration-color-prop.html
  (4) text-decoration-style属性:设置文本修饰的样式（如实心，波浪，点线，虚线，双线）。
  提示：text-decoration属性是text-decoration-line，text-decoration-style和text-decoration-color的简写属性。
  详见：https://www.jc2182.com/css/css-text-decoration-style-prop.html