[分享]css写100%不起作用

在前端开发过程中，CSS 是不可或缺的一部分，但我们有时候在写 CSS 的时候会遇到一些棘手的问题，比如写了一份 CSS 却发现它根本不起作用，本文将介绍几个常见的情况，让你知道为什么 CSS 会 1...

在前端开发过程中，CSS 是不可或缺的一部分，但我们有时候在写 CSS 的时候会遇到一些棘手的问题，比如写了一份 CSS 却发现它根本不起作用，本文将介绍几个常见的情况，让你知道为什么 CSS 会 100% 不起作用。

/* 情况一：CSS 选择器不正确 */
p {
    color: red;
}

/* 如果 HTML 代码中没有使用 p 标签时，以上 CSS 就会完全无效 */

div p {
    color: red;
}

/* 如果 p 标签不是 div 标签内的后代元素，以上 CSS 同样无效 */

/* 情况二：CSS 文件没有被正确引用 */
<link rel="stylesheet" href="style.css">

/* 检查一下文件路径是否正确，或者文件名是否写错了 */

/* 情况三：CSS 样式被覆盖 */
p {
    color: blue;
}

p {
    color: red;
}

/* 红色颜色会覆盖蓝色，因此以上 CSS 的效果是红色字体 */

/* 情况四：CSS 文件没有被正确链接 */
<link href="style.css" />

/* 如果 href 属性没有被正确用引号框起来，浏览器会将其解释为属性值的一部分从而找不到 CSS 文件 */

/* 情况五：CSS 属性被拼写错误 */
p {
    colorr: red;
}

/* colorr 是一个不存在的属性，所以以上代码将不起作用 */ 

以上就是 CSS 不起作用的几种情况，如果你的 CSS 还是不起作用，可以仔细检查一下以上几个方面，看是不是出了问题。