Question

版权信息作为下一个菜单项，但我希望它作为居中文本出现在页脚内的下一行，所以请告诉我如何才能实现这一点。请帮忙。提前谢谢。

/* ----- FOOTER ----- */




.footer-nav{  
  display: flex; 
  flex-direction: row;
  justify-content: space-between;
  list-style: none;
  text-align: center;
  text-transform: uppercase;
  background-color: #333;
  padding: 50px;
  font-size: 80%;
  }



.footer-nav li{
   
    flex-grow: 100%;
}

<div class="wrapper">

<ul class="footer-nav">
        <li><a href="#">About Us</a></li>
              <li><a href="#">blah</a></li>
              <li><a  href="#"blah</a></li>  
              <li><a href="#">blah</a></li>

            <p class = "copyright">aaa</p>

    </ul>





</div>

Answer 1

你可以做很多方法。如果您希望列表中包含版权，则需要将其包含在li中，因为只有li可以是ul的孩子。然后，只需提供li width: 100%或flex-basis: 100%，并将父级设为flex-wrap: wrap

.footer-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  list-style: none;
  text-align: center;
  text-transform: uppercase;
  background-color: #333;
  padding: 50px 50px 25px;
  font-size: 80%;
}

.footer-nav li {
  flex-grow: 100%;
}
.copyright {
  flex-basis: 100%;
  margin-top: 25px;
}

<div class="wrapper">

  <ul class="footer-nav">
    <li><a href="#">About Us</a></li>
    <li><a href="#">blah</a></li>
    <li><a href="#">blah</a></li>
    <li><a href="#">blah</a></li>
    <li class="copyright"><p>aaa</p></li>
  </ul>
  
</div>

Answer 2

从ulr标记中取出背景颜色并将其添加到.wrapper

同样从ul列表中删除p标记，并将其放在列表外部但在包装器内

将text-align：center应用于p标签

从页脚中移除填充顶部和填充底部以获得合适的效果

下面的代码段

/* ----- FOOTER ----- */


p{
text-align:center;
}

.footer-nav{  
  display: flex; 
  flex-direction: row;
  justify-content: space-between;
  list-style: none;
  text-align: center;
  text-transform: uppercase;
  padding: 50px;
  padding-top:0;
  padding-bottom:0;
  font-size: 80%;
  }



.footer-nav li{
   
    flex-grow: 100%;
}
.wrapper{
  background-color: #333;
  }

<div class="wrapper">

<ul class="footer-nav">
        <li><a href="#">About Us</a></li>
              <li><a href="#">blah</a></li>
              <li><a  href="#"blah</a></li>  
              <li><a href="#">blah</a></li>

    </ul>
                <p class = "copyright">aaa</p>





</div>

Answer 3

我，你应该尝试使用footer元素并将<ul>置于<p>之内，<ul>之外的.footer-nav{ display: flex; flex-direction: row; justify-content: space-between; list-style: none; text-align: center; text-transform: uppercase; padding: 50px; font-size: 80%; } footer{ background-color: #333; } .copyright{ text-align: center; color: white; } .footer-nav li{ flex-grow: 100%; }使用特殊类来对文本进行居中。

CSS：

<div class="wrapper">
<footer>
  <ul class="footer-nav">
        <li><a href="#">About Us</a></li>
              <li><a href="#">blah</a></li>
              <li><a  href="#"</a>blah</li>  
              <li><a href="#">blah</a></li>
    </ul>
     <p class="copyright">aaa</p>
</footer>
</div>

和HTML：

string excelConnectionString = System.Configuration.ConfigurationManager.ConnectionStrings["xlsx"].ConnectionString + fileLocation;
//connection String for xls file format.
if (fileExtension == ".xls")
{
    excelConnectionString = System.Configuration.ConfigurationManager.ConnectionStrings["xlsx"].ConnectionString + fileLocation;
}
//connection String for xlsx file format.
else if (fileExtension == ".xlsx")
{
    excelConnectionString = System.Configuration.ConfigurationManager.ConnectionStrings["xlsx"].ConnectionString + fileLocation;                        
}
//Create Connection to Excel work book
OleDbConnection excelConnection = new OleDbConnection(excelConnectionString);
excelConnection.Open();

https://jsfiddle.net/nesquimo/u1pq6xvq/

如何在网页页脚中包含版权信息？

3 个答案: