Question

即使列表位于页脚内部，列表也不会在页脚内部移动标签

我试图寻找另一个有用的网站和一些在这里的线程，但没有运气......

我也试过把float：left等等......

HTML：

  <footer>
                  <!-- <section class="f-sec1"> -->
                       <!-- <h5>CAD | Tech Website&copy;</h5> -->
                       <ul class="f-li">
                        <li><a href="index.html" class="current">Home</a></li>
                        <li><a href="services.html">Services</a></li>
                        <li><a href="contact.php">Contact</a></li>
                        <li><a href="about.html">About us</a></li>
                  </ul>

                        <br>



                  </section>
             </footer>

CSS：

   footer {
       background: #444;
   }

   /* First Section */

   .f-sec1 h5 {
       color: #FFFFFF;
   }

   .h-sec {
       font: 22px Arial, Helvetica;
   }

   .sec {
       font: 9px, Arial, Helvetica;
   }

   .fl-li {
       list-style-type: none;
   }
   .f-li li a {
       color: #000000;
       float: right;
   }

   .f-li .current {
       color: #A9A9A9;
       text-decoration: underline;
   }

Answer 1

关闭页脚而不是部分时，它可以正常工作。

＆＃13;

footer {
  background: #444;
}


/* First Section */

.f-sec1 h5 {
  color: #FFFFFF;
}

.h-sec {
  font: 22px Arial, Helvetica;
}

.sec {
  font: 9px, Arial, Helvetica;
}

.f-li {
  list-style-type: none;
}

.f-li li a {
  color: #000000;
  float: right;
}

.f-li .current {
  color: #A9A9A9;
  text-decoration: underline;
}

＆＃13;

<footer>
  <!-- <section class="f-sec1"> -->
  <!-- <h5>CAD | Tech Website&copy;</h5> -->
  <ul class="f-li">
    <li><a href="index.html" class="current">Home</a></li>
    <li><a href="services.html">Services</a></li>
    <li><a href="contact.php">Contact</a></li>
    <li><a href="about.html">About us</a></li>
  </ul>
</footer>

＆＃13;

Answer 2

您尚未关闭页脚标记。

<footer>
     <!-- <h5>CAD | Tech Website&copy;</h5> -->
     <ul class="f-li">
      <li><a href="index.html" class="current">Home</a></li>
      <li><a href="services.html">Services</a></li>
      <li><a href="contact.php">Contact</a></li>
      <li><a href="about.html">About us</a></li>
     </ul>
</footer>

Answer 3

我添加了clearfix，它起作用了：

<footer class="clearfix">
  <!-- <section class="f-sec1"> -->
  <!-- <h5>CAD | Tech Website&copy;</h5> -->
  <ul class="f-li">
    <li><a href="index.html" class="current">Home</a></li>
    <li><a href="services.html">Services</a></li>
    <li><a href="contact.php">Contact</a></li>
    <li><a href="about.html">About us</a></li>
  </ul>
</footer>

<ul>不会移动到页脚内部，即使它是？

3 个答案: