HTML样式生效关键在于正确使用style属性、<style>标签或外部CSS文件，并注意优先级与作用域；内联样式需用双引号包裹、单位不可省、分号分隔；<style>必须置于<head>内；外部CSS用<link>引入，路径需准确；调试优先查DevTools。
HTML 样式代码不是靠“写一堆样式就能生效”，关键在 style 属性、<style> 标签或外部 .css 文件这三种用法是否匹配当前需求，且优先级和作用范围没被忽略。
内联样式怎么加：只对单个元素临时改样式
用 style 属性直接写在 HTML 标签里，适合调试或极个别覆盖。注意属性名是 CSS 语法（如 background-color），不是 HTML 原生属性，且值必须带单位（px、em 等）或引号包裹字符串。
常见错误：<p style="color: red; font-size: 14">文字</p> —— 缺少 px 单位，浏览器会忽略 font-size；<div style=color:blue> —— 缺少引号，HTML 解析失败。
- 必须用双引号包裹整个
style值 - 多个声明用英文分号
;分隔 - 不推荐大量使用：无法复用、维护难、优先级过高反而难覆盖
<style> 标签写在哪：页面级样式最常用的位置
<style> 必须放在 <head> 内，不能写在 <body> 里（虽然部分浏览器能渲染，但不符合规范，可能触发 quirks mode）。里面写的是标准 CSS 规则，选择器可作用于整个页面。
立即学习“前端免费学习笔记（深入）”；
典型误用：<body><style>p{color:green}</style><p>内容</p></body> —— <style> 在 <body> 中属于无效位置，部分旧浏览器可能不解析。
- 写在
<head>中最稳妥 - 可用
@import引入其他 CSS 文件，但性能较差，不推荐 - 注意选择器权重：比如
#header p会比p优先级高，覆盖时得留意
外部 CSS 文件怎么连：项目变大后必须走这步
用 <link rel="stylesheet" href="style.css"> 连接外部文件，href 路径必须准确——相对路径基于 HTML 文件位置，不是 CSS 文件位置。
常见卡点：index.html 在根目录，style.css 在 /css/style.css，却写成 href="css/style.css"（正确）还是 href="/css/style.css"（也正确，但含义不同）？前者是相对路径，后者是根对路径，混用容易 404。
-
href值不加file://或绝对 URL，除非真要跨域引用 - 文件编码统一为 UTF-8，避免中文注释或字符乱码
- 修改 CSS 后浏览器可能缓存旧版本，开发时可强制刷新（
Ctrl+Shift+R）或禁用缓存（DevTools → Network → Disable cache）
真正容易出问题的不是“怎么写样式”，而是样式没生效时不知道查哪：先看浏览器 DevTools 的 Elements 面板里该元素是否被选中、对应样式是否划掉（被更高优先级覆盖）、是否显示“invalid property value”、href 路径有没有标红 404。这些比背代码重要得多。
