使用HTML与CSS编写网页时footer样式无法生效问题咨询

问题排查及解决方法 #

你代码里最明显的语法错误是十六进制颜色值缺少#前缀，从你附的HTML截图可以确认页面存在footer元素，所以优先按以下步骤处理：

1. 修正背景色属性写法
   你当前的CSS写法不符合规范，浏览器会直接忽略无效的背景色规则：

/* 错误写法 */
footer{ 
    width: 100%; 
    background-color:  000066; 
    padding: 60px 0px; 
}

正确写法如下，十六进制颜色必须以#开头：

footer{ 
    width: 100%; 
    background-color: #000066; 
    padding: 60px 0px; 
}

2. 修正后样式仍不生效的话，依次排查以下常见问题：

• 检查HTML是否正确引入CSS文件：确认<head>标签内有正确的引入代码，href属性的文件名要和你实际的CSS文件名完全一致，大小写也要匹配：

  <link rel="stylesheet" href="你的CSS文件名.css">
  

• 按F12打开浏览器开发者工具，选中footer元素查看样式面板，如果你写的footer规则是划掉状态，说明被更高权重的CSS规则覆盖了，调整选择器权重即可。
• 确认没有父元素设置了overflow: hidden等属性，或者其他元素遮挡了footer区域，导致设置的样式不可见。

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