为什么外部CSS文件中设置的font-size属性对页面元素不生效？

可能的原因及排查方案 #

• 外部CSS文件引入路径错误
  这是最高发的原因，优先排查：
  检查HTML头部的<link>标签的href属性是否和实际CSS文件的存放路径匹配，注意相对路径层级、文件名称大小写（Linux服务器对大小写敏感，style.css和Style.css会被识别为两个文件）。可以打开浏览器开发者工具（F12）切换到「网络」面板，刷新页面后查看CSS文件的请求状态，若返回404即可确认是路径问题。
• 引入标签配置错误
  检查CSS引入的link标签是否符合规范，正确写法示例：

  <link rel="stylesheet" href="./css/style.css">
  

  漏写rel="stylesheet"、错写属性值都会导致浏览器不会将对应文件解析为样式表生效。
• CSS文件存在前置语法错误
  如果你写的.navbar-brand规则之前还有其他样式，检查前面的规则是否遗漏了闭合花括号}、属性值漏写引号或分号，单个语法错误会导致后面所有的样式规则都失效。可以打开浏览器开发者工具的「元素」面板，选中页面上的.navbar-brand元素，查看样式列表中是否存在你写的规则，完全没有出现即可确认是样式文件没有被正确解析/加载。
• 浏览器缓存问题
  浏览器会缓存旧的CSS文件，哪怕你本地已经修改了内容，加载的还是旧版本。可以按Ctrl+F5强制刷新页面，或者在开发者工具的「网络」面板勾选「禁用缓存」后再刷新验证。
• base标签影响路径解析
  如果你的HTML头部加了<base>标签，所有相对路径的资源都会以该标签指定的地址为基准解析，也会导致CSS文件加载失败。

内容的提问来源于stack exchange，提问作者Vishal Sharma