Update README.md

Author: lio-zero

README.md

@@ -1,8 +1,87 @@
 # CSS Tricks
 
-本仓库的 CSS 技巧是从我另一个仓库 [blog](https://github.com/lio-zero/blog) 的 [常用的一些 CSS 技巧一](https://github.com/lio-zero/blog/blob/master/CSS/%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%20CSS%20%E6%8A%80%E5%B7%A7%E4%B8%80.md)和[常用的一些 CSS 技巧二 — 选择器（伪类与伪元素）](https://github.com/lio-zero/blog/blob/master/CSS/%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%20CSS%20%E6%8A%80%E5%B7%A7%E4%BA%8C%20%E2%80%94%20%E9%80%89%E6%8B%A9%E5%99%A8%EF%BC%88%E4%BC%AA%E7%B1%BB%E4%B8%8E%E4%BC%AA%E5%85%83%E7%B4%A0%EF%BC%89.md)整理过来的，目的为了方便后续的阅读和添加新内容。
-
-[TOC]
+本仓库的 CSS 技巧是从我另一个仓库 [blog](https://github.com/lio-zero/blog) 的[常用的一些 CSS 技巧一](https://github.com/lio-zero/blog/blob/master/CSS/%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%20CSS%20%E6%8A%80%E5%B7%A7%E4%B8%80.md)和[常用的一些 CSS 技巧二 — 选择器（伪类与伪元素）](https://github.com/lio-zero/blog/blob/master/CSS/%E5%B8%B8%E7%94%A8%E7%9A%84%E4%B8%80%E4%BA%9B%20CSS%20%E6%8A%80%E5%B7%A7%E4%BA%8C%20%E2%80%94%20%E9%80%89%E6%8B%A9%E5%99%A8%EF%BC%88%E4%BC%AA%E7%B1%BB%E4%B8%8E%E4%BC%AA%E5%85%83%E7%B4%A0%EF%BC%89.md)整理过来的，目的是为了方便后续的阅读和添加新内容。
+
+- [CSS3 中的 counter](#css3-中的-counter)
+- [使用 CSS white-space 修复文本重叠](#使用-css-white-space-修复文本重叠)
+- [Flexbox 居中元素](#flexbox-居中元素)
+- [Gird 居中元素](#gird-居中元素)
+- [在 CSS 中更改光标颜色](#在-css-中更改光标颜色)
+- [使非密码输入使用符号替代](#使非密码输入使用符号替代)
+- [CSS user-select 禁用文本选择](#css-user-select-禁用文本选择)
+- [自定义 CSS 选择样式](#自定义-css-选择样式)
+- [CSS 变量](#css-变量)
+  - [全局范围内定义](#全局范围内定义)
+  - [局部范围内定义](#局部范围内定义)
+- [text-rendering](#text-rendering)
+- [类似原生的 IOS 滚动](#类似原生的-ios-滚动)
+- [蚀刻文字](#蚀刻文字)
+- [实现文本溢出省略效果](#实现文本溢出省略效果)
+- [渐变文字](#渐变文字)
+- [文本描边效果](#文本描边效果)
+- [系统字体堆栈](#系统字体堆栈)
+- [叠纸效果](#叠纸效果)
+- [隐藏数字输入微调器](#隐藏数字输入微调器)
+- [发光的蓝色输入亮点](#发光的蓝色输入亮点)
+- [使用 fieldset 禁用表单](#使用-fieldset-禁用表单)
+- [非表单 fieldset 外观](#非表单-fieldset-外观)
+- [将 WebKit 的文件上传输入按钮强制向右移动](#将-webkit-的文件上传输入按钮强制向右移动)
+- [简单而漂亮的 Blockquote 样式](#简单而漂亮的-blockquote-样式)
+- [使用纯 CSS 创建三角形](#使用纯-css-创建三角形)
+- [制作一个列宽相等的表格](#制作一个列宽相等的表格)
+- [重置所有样式](#重置所有样式)
+- [在 HTML 中的字符串中保留空格和换行符](#在-html-中的字符串中保留空格和换行符)
+- [使用 hr 作为分隔符](#使用-hr-作为分隔符)
+- [从图像中剔除白色背景](#从图像中剔除白色背景)
+- [使用指针事件来控制鼠标事件](#使用指针事件来控制鼠标事件)
+- [指示缺少 alt 属性的 img 元素](#指示缺少-alt-属性的-img-元素)
+- [快速输入颜色变量](#快速输入颜色变量)
+- [使用 currentColor 关键字重用当前颜色](#使用-currentcolor-关键字重用当前颜色)
+- [给“默认”链接定义样式](#给默认链接定义样式)
+- [用 rem 来调整全局大小；用 em 来调整局部大小](#用-rem-来调整全局大小用-em-来调整局部大小)
+- [为 body 元素添加行高](#为-body-元素添加行高)
+- [转义 CSS 类名](#转义-css-类名)
+- [使用 SVG 图标](#使用-svg-图标)
+- [在打印模式下显示链接](#在打印模式下显示链接)
+- [隐藏 Microsoft Edge 的密码显示按钮](#隐藏-microsoft-edge-的密码显示按钮)
+- [防止锚链接消失在粘性标题后面](#防止锚链接消失在粘性标题后面)
+- [创建自定义表情符号光标](#创建自定义表情符号光标)
+- [CSS 重置盒模型](#css-重置盒模型)
+- [清除浮动](#清除浮动)
+- [:focus 状态样式](#focus-状态样式)
+- [:focus-within](#focus-within)
+- [实现分割线](#实现分割线)
+- [为破损的图片定义样式](#为破损的图片定义样式)
+- [CSS `:empty`](#css-empty)
+  - [显示空列表的占位符](#显示空列表的占位符)
+  - [设置空链接的内容](#设置空链接的内容)
+- [CSS :only-child](#css-only-child)
+- [CSS :not()](#css-not)
+- [逗号分隔列表](#逗号分隔列表)
+- [移除最后一个导航项的边框](#移除最后一个导航项的边框)
+- [隐藏没有静音、自动播放的影片](#隐藏没有静音自动播放的影片)
+- [单独的项目列表](#单独的项目列表)
+- [CSS 设置 ::placeholder 文本的样式](#css-设置-placeholder-文本的样式)
+- [CSS :placeholder-shown](#css-placeholder-shown)
+- [自定义列表](#自定义列表)
+- [自定义文字选择](#自定义文字选择)
+- [自定义 WebKit 滚动条](#自定义-webkit-滚动条)
+- [首字大写](#首字大写)
+- [只显示第一个字母](#只显示第一个字母)
+- [使用 `:nth-child()` 创建具有交替背景颜色的列表](#使用-nth-child-创建具有交替背景颜色的列表)
+- [使用负 `:nth-child` 和 `:nth-last-child` 来选择元素](#使用负-nth-child-和-nth-last-child-来选择元素)
+- [:hover](#hover)
+- [::marker](#marker)
+- [使用 :invalid 和 :valid 校验表单元素](#使用-invalid-和-valid-校验表单元素)
+- [使用 :checked 和 `:default` 赋予元素状态](#使用-checked-和-default-赋予元素状态)
+- [将前导零附加到有序列表项](#将前导零附加到有序列表项)
+- [使用特殊字符设置列表项的样式](#使用特殊字符设置列表项的样式)
+- [使用 “形似猫头鹰” 选择器](#使用-形似猫头鹰-选择器)
+- [将样式与 :is 伪类选择器组合](#将样式与-is-伪类选择器组合)
+- [使用 :root 选择器灵活控制字体大小](#使用-root-选择器灵活控制字体大小)
+- [利用属性选择器来选择空链接](#利用属性选择器来选择空链接)
+- [利用 `+` 隐藏额外的换行符](#利用--隐藏额外的换行符)
+- [在行内元素之间添加换行符](#在行内元素之间添加换行符)
 
 ## CSS3 中的 counter