一、普通方法

1.使用W3C验证器（在线/命令行工具）不用试了；

2.使用vscode看颜色；

3.使用WebStorm看颜色；

4.使用开发者工具看警告。

• 如何使用开发者工具 （1）找到自己脑中的标签；

（2）看他是否有选择器；

（3）看他的样式是否被划掉；怀疑某

（4）看他的样式是否有警告。

二、Border调试法

1.步骤

• 怀疑某个元素有问题
• 就给这个元素加border
• border没出现？说明选择器错了或者语法错了
• border出现了？看看边界是否符合预期
• bug解决了才可以把border删掉

2.记住

• css的border调试法就相当于JS的log调试法

三、示范

1.border没出现，选择器错误。

• 正确的：

• 错误的：

2.bug发生在border之前

四、写代码需要避免的一些低级错诶

• 选择器拼写错误
• 属性名拼写错误
• 属性值拼写错误
• 大小写错误
• 没写分号
• 中文冒号
• 没写反花括号
• 没加单位