表格未应用CSS的首要原因是<link>标签书写错误，包括rel属性值非"stylesheet"、href路径错误、位置不在<head>内、大小写不匹配或media属性不匹配当前环境；其次才是CSS文件中缺少table/th/td等选择器规则或编码问题。
直接用 <link> 标签在 <head> 里引入外部 CSS 文件，表格本身不需要额外操作——只要 CSS 里写了针对 table、th、td 等选择器的规则，样式就会自动生效。
为什么表格没应用CSS？先查 <link> 标签是否写对
90% 的“表格没样式”问题，其实和表格无关，而是 <link> 标签本身出错。常见错误包括：
-
rel写成rel="style"或漏写，必须是rel="stylesheet" -
href路径错误：比如 CSS 文件在css/style.css，却写成href="style.css" -
<link>放在<body>里，或放在<head>外，浏览器可能忽略或延迟加载 - 路径大小写不一致（尤其在 Linux 服务器上），如
Style.css≠style.css
<link> 的 media 属性影响表格样式加载时机
如果给 <link> 加了 media 属性，而当前环境不匹配，表格就完全不会读取该 CSS。例如：
<link rel="stylesheet" href="table.css" media="print">
这段代码只在打印预览时生效，普通浏览下 table.css 里的所有规则（包括 table { border-collapse: collapse; }）都不会作用于页面表格。
立即学习“前端免费学习笔记（深入）”；
- 默认不写
media，等价于media="all"，始终生效 - 响应式场景常用
media="screen and (max-width: 768px)"，但需确认当前视口宽度是否满足条件 - 调试时可临时删掉
media属性，排除加载被拦截的问题
CSS 文件里没写表格相关选择器，引入也没用
引入文件只是“加载”，不是“自动美化”。即使 <link> 正确，如果 CSS 文件里没定义任何针对表格的样式，表格依然保持浏览器默认样式。
- 基础表格美化通常需要至少这几条：
table、th、td、border-collapse、padding - 别依赖“引入了就变好看”——检查你的
table.css是否真有类似这样的内容：
table { border-collapse: collapse; width: 100%; }
th, td { padding: 8px; text-align: left; border: 1px solid #ddd; }
没有对应规则，再正确的 <link> 也白搭。
最容易被忽略的点：CSS 文件编码不是 UTF-8，或者含 BOM 头，会导致部分规则解析失败——尤其是中文注释或特殊字符附近的选择器莫名失效。打开 CSS 文件用编辑器另存为“UTF-8 无 BOM”格式，再试一次。
