当浏览器加载CSS文件时，会根据服务器返回的Content-Type响应头判断资源类型，如果返回的类型不符合CSS的预期MIME类型text/css，就会在控制台抛出MIME错误，导致样式无法正常生效。这类问题除了服务器配置问题外，link标签的属性设置不当也是常见诱因。
常见MIME错误表现
控制台通常会提示类似Refused to apply style from 'xxx.css' because its MIME type ('xxx') is not a supported stylesheet MIME type, and strict MIME checking is enabled的错误信息，此时页面的样式会完全丢失或者部分失效。
通过link标签type属性解决问题
link标签用于引入外部CSS文件时，正确的type属性设置可以辅助浏览器识别资源类型，避免MIME校验失败。按照规范，CSS对应的type属性值应为text/css，虽然现代浏览器可以自动识别CSS文件的类型，但在部分严格校验的场景下，显式设置type属性可以避免错误。
正确的link标签写法如下：
<!-- 正确设置type属性的link标签引入CSS --> <link rel="stylesheet" type="text/css" href="style.css">
需要注意的几点：
- rel属性必须设置为stylesheet，这是标识当前资源为样式表的核心属性
- type属性值必须严格写为text/css，不要写错大小写或者拼写
- href属性指向的CSS文件路径必须正确，避免404导致服务器返回错误的MIME类型
其他可能的原因排查
如果已经正确设置了link标签的type属性仍然报错，需要排查以下方向：
服务器MIME类型配置
检查服务器是否正确映射了.css后缀的MIME类型，以Nginx为例，正确的配置如下：
# Nginx配置CSS的MIME类型
server {
listen 80;
server_name localhost;
# 静态资源MIME类型映射
include mime.types;
# 确保css的MIME类型为text/css
types {
text/css css;
}
location / {
root /usr/share/nginx/html;
index index.html;
}
}
内联样式和其他引入方式的问题
如果是使用@import方式引入CSS，也需要确保路径正确，且被引入的CSS文件本身没有MIME问题：
/* 正确的@import引入方式 */
@import url("reset.css");
/* 错误示例：路径错误会导致加载失败返回错误MIME */
/* @import url("resets.css"); */
验证修复效果
修复完成后，可以打开浏览器的开发者工具，切换到Network面板，找到对应的CSS请求，查看Response Headers中的Content-Type是否为text/css，同时查看Console面板是否还有MIME相关的错误提示，确认问题已经解决。