html - 无法形成页脚

标签 html css

<分区>


这个问题是由于错别字或无法再重现的问题引起的。虽然类似的问题可能是on-topic在这里,这个问题的解决方式不太可能帮助 future 的读者。

关闭 7 年前

我是编码新手。我正在观看一个教程,即使我准确地复制了代码(我认为),背景颜色也没有应用到页脚上,填充也不起作用。

@charset "utf-8";
/* CSS Document */
body {
    margin:0;
    font-family:Georgia, "Times New Roman", Times, serif;
}
.wrapper {
    width: 960px;
    margin: 0 auto;
}

.clear {
    clear: both;
}

#phonebar {
    background-color:#343434;
    color: #b0b0b0;
    font-size:12px;
    padding: 8px 0;
    text-align:right;
}

header {
    background-color:#e6e6e6;
    padding: 18px 0;
}

h1 {
font-weight: normal;
color:#696969;
font-size:34px;
margin:0;   
float:left;
}

ul {
    margin:0
}

nav { 
     float:right;
}

li {
    list-style-type:none;
    float:left;
    margin-left: 25px;
    font-weight:bold;
    font-size: 14px;
    color:#5a5a5a;
    margin-top:12px;
}

#important {
    padding: 40px 0;
}

#left {
    float:left;
    width: 510px;
}

#left h1 {
    float:none;
}

img {
    float: right;
    background-color: white;
    padding: 10px;
    border: 1px solid #aaaaaa;
}

p {
   font-size: 14px;
   line-height: 30px;
   color: #7f7f7f;  
}

#moreinfo {
    background-color: #343434;
    padding: 15px 0;
}

.col {
    float: left;
    width: 280px;
    margin-right: 40px;
}

h2 {
    font-size: 24px;
    font-weight: normal;
    color: #b0b0b0;
}

foooter {
    background-color: #252525;
    color: #b0b0b0;
    font-size: 12px;
    padding: 15px 0;
}

footer span {
    float: right;
}
<!doctype html>
<html>
   <head>
      <meta charset="utf-8">
      <title>Some Company</title>
      <link rel="stylesheet" type="text/css" href="stylesheet.css" />
   </head>
   <body>
      <div id="phonebar">
         <div class="wrapper">
            Find out more by calling 900-555-2300
         </div>
      </div>
      <header>
         <div class="wrapper">
            <h1>Some Company, Inc.</h1>
            <nav>
               <ul>
                  <li>Home</li>
                  <li>About</li>
                  <li>Products</li>
                  <li>Contact</li>
               </ul>
            </nav>
            <div class="clear"></div>
         </div>
      </header>
      <div id="important">
         <div class="wrapper">
            <div id="left">
               <h1>This is Cool</h1>
               <p>A super PAC supporting Mr. Kasich quickly swiped back at Mr. Bush, mocking him for a “campaign that sunk like a rock.” At the same time, a super PAC backing Mr. Rubio continues to blast Mr. Christie, reminding Republicans of the scandal involving the governor’s aides over the shutdown of the George Washington Bridge, and of his embrace of President Obama in 2012 after Hurricane Sandy hit New Jersey.</p>
            </div>
            <img src="something" alt="dog" />
            <div class="clear"></div>
         </div>
      </div>
      <div id="moreinfo">
         <div class="wrapper">
            <div class="col">
               <h2>Another Header</h2>
               <p>A super PAC supporting Mr. Kasich quickly swiped back at Mr. Bush, mocking him for a “campaign that sunk like a rock.” At the same time, a super PAC backing Mr. Rubio continues to blast Mr. Christie, reminding Republicans of the scandal involving the governor’s aides over the shutdown of the George Washington Bridge, and of his embrace of President Obama in 2012 after Hurricane Sandy hit New Jersey.</p>
            </div>
            <div class="col">
               <h2>Another Header</h2>
               <p>A super PAC supporting Mr. Kasich quickly swiped back at Mr. Bush, mocking him for a “campaign that sunk like a rock.” At the same time, a super PAC backing Mr. Rubio continues to blast Mr. Christie, reminding Republicans of the scandal involving the governor’s aides over the shutdown of the George Washington Bridge, and of his embrace of President Obama in 2012 after Hurricane Sandy hit New Jersey.</p>
            </div>
            <div class="col">
               <h2>Another Header</h2>
               <p>A super PAC supporting Mr. Kasich quickly swiped back at Mr. Bush, mocking him for a “campaign that sunk like a rock.” At the same time, a super PAC backing Mr. Rubio continues to blast Mr. Christie, reminding Republicans of the scandal involving the governor’s aides over the shutdown of the George Washington Bridge, and of his embrace of President Obama in 2012 after Hurricane Sandy hit New Jersey.</p>
            </div>
            <div class="clear"></div>
         </div>
      </div>
      <footer>
         <div class="wrapper">
            &copy; Copyright Some Company
            <span>contact@example.com</span>
         </div>
      </footer>
   </body>
</html>

最佳答案

我可以看到问题。

foooter {
   background-color: #252525;
   color: #b0b0b0;
   font-size: 12px;
   padding: 15px 0;
}

您用三个 o 而不是只有两个来写页脚。

关于html - 无法形成页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35062084/

上一篇:javascript - 尝试显示和隐藏元素失败

下一篇:html - 覆盖 CSS 属性

相关文章:

javascript - 使用 jQuery 延迟加载 html 视频

html - 使用 CSS 将我的 Logo 定位在导航栏中

PHPExcel 突然不工作

javascript - 如何在 HTML5 Canvas 中禁用形状抗锯齿? (imageSmoothingEnabled 和像素化不起作用)

CSS:强制一个 div 以适应浏览器屏幕?

html - 页脚贴在底部,超出页面

javascript - 仅在指定事件上使用 animate.css 的 angularjs?

javascript - 将样式应用于 Angular 2 中动态创建的元素

html - 如何修复整体样式表触发的IE绝对定位CSS渲染错误?

css - map 信息框(单击图标时)未正确显示 CSS