整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
加style
<style type="text/css">
html {
position: relative;
min-height: 100%;
}
body {
margin-bottom: 60px;
}
.footer {
position: absolute;
bottom: 0; width: 100%;
/* Set the fixed height of the footer here */
height: 60px;
background-color: #f5f5f5;
}
</style>
.......
.....
</div>
<footer class="footer">
<div style="text-align:center;">
Copyright 2019 by Ben
</div>
</footer>
</body>
image.png
效果圖，不管窗口放大還是調(diào)小，footer 都會(huì) 顯示在最底也，也不會(huì)覆蓋content 里面的內(nèi)容。
局和腳部是 HTML 頁面中兩個(gè)重要的區(qū)域。布局區(qū)域用于組織頁面上的內(nèi)容，而腳部區(qū)域通常包含與頁面內(nèi)容無關(guān)但重要的信息。
布局區(qū)域
布局區(qū)域用于將頁面上的內(nèi)容分組和排列。最常用的布局區(qū)域是：
腳部區(qū)域
腳部區(qū)域通常包含以下內(nèi)容：
布局和腳部的組合
布局區(qū)域可以包含腳部區(qū)域。例如，以下代碼展示了如何將腳部區(qū)域包含在布局區(qū)域內(nèi)：
html<!DOCTYPE html>
<html>
<head>
<!-- ... -->
</head>
<body>
<div id="layout">
<!-- ... -->
<footer>
<p>? 20 vicisslet 20 vicisslet</p>
<p>聯(lián)系：...</p>
<p>社交媒體：...</p>
</footer>
</div>
</body>
</html>
最佳實(shí)踐
結(jié)論
布局和腳部是 HTML 頁面中兩個(gè)重要的區(qū)域。通過了解布局和腳部區(qū)域的用法，您可以創(chuàng)建擁有清晰結(jié)構(gòu)和良好閱讀體驗(yàn)的頁面。
的網(wǎng)站由華為云遷移到阿里云了。為啥遷移呢？因?yàn)槿A為云續(xù)費(fèi)實(shí)在太貴了，阿里云又在大促銷，2核8G的ECS 云主機(jī)3年1000多塊錢，所以在阿里云上新注冊(cè)了一個(gè)用戶，買了三年的ECS云主機(jī)。
以前找專業(yè)美工設(shè)計(jì)過一個(gè)網(wǎng)站的首頁，過一段時(shí)間后，思路有變化，就像改一版，但自己又不是專業(yè)美工，找人修改又要花錢，所以，就下載了一個(gè)Vuepress，用Vuepress搭建自己的官方網(wǎng)站。
國內(nèi)的云主機(jī)，做域名指向的時(shí)候，都需要進(jìn)行備案，備案信息，一般會(huì)放在Vuepress的footer標(biāo)簽下，并加上一個(gè)指向信息化部備案查詢的網(wǎng)站：http://www.beian.miit.gov.cn/，并加上自己的備案號(hào)。非常遺憾的是，Vuepress的footer標(biāo)簽是不支持任何 <a herf > 之類的鏈接的，所以只能顯示備案號(hào)，并不能指向信息化部備案查詢的網(wǎng)站。如下圖所示：
用百度查詢，根本查不到任何有效信息，用Google查了一下，居然真的就查到了有人報(bào)了Vuepress的Bug，試圖解決這個(gè)問題，如下圖所示：
遺憾的是，Vuepress 作者并不是認(rèn)為這是一個(gè)Bug，也不打算修復(fù)這個(gè)問題，回復(fù)如下：
令人非常失望，那么怎么辦呢？國內(nèi)域名空間提供商要求是在備案號(hào)下必須指向信息化部備案查詢的網(wǎng)站的，否則備案就不會(huì)被通過。邢老師我想了好久，終于找到了一個(gè)不是辦法的辦法，即直接修改Vuepress發(fā)布完成的靜態(tài)HTML頁面好了，原來的Vuepress 的footer標(biāo)簽如下：
footer: Copyright ? 2019 XXX信息技術(shù)有限公司 | Email:ddd@eshop | 京ICP備16059853號(hào)生成的HTML代碼如下：
<div class="footer">Copyright ? 2019 XXX信息技術(shù)有限公司 Email:xbt@eshopinone.com 京ICP備16059853號(hào)</div>即無法指向 http://www.beian.miit.gov.cn
我把footer生成的靜態(tài)HTML頁面直接修改為：
<div class="footer">Copyright ? 2019 XXX信息技術(shù)有限公司 Email:xbt@eshopinone.com <a href='http://www.beian.miit.gov.cn' target="_blank">京ICP備16059853號(hào)</a></div>就可以在首頁上看到備案號(hào)和指向備案信息的鏈接了。機(jī)智如我，但是，每次用Vuepress打包發(fā)布，都需要手動(dòng)修改這個(gè)HTML頁面了。
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
