html - 在多个 HTML 页面中重复使用页脚

标签 html css layout

我正在开发一个提供 5 个 HTML 页面的 Web 模板。我很惊讶每个页面内都有相同的页 footer 分,如下所示:

<footer>
    <div class="footerrow1">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 maxheight1 footercol1">
                    <a class="smallogo" href="index.html"><img src="img/logosmall.png" alt=""></a>
                    <ul class="social_icons clearfix">
                         <li><a href="#"><img src="img/follow_icon1.png" alt=""></a></li>
                         <li><a href="#"><img src="img/follow_icon2.png" alt=""></a></li>
                         <li><a href="#"><img src="img/follow_icon3.png" alt=""></a></li>
                         <li><a href="#"><img src="img/follow_icon4.png" alt=""></a></li>
                         <li><a href="#"><img src="img/follow_icon5.png" alt=""></a></li>
                    </ul> 
                </div>
                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 maxheight1 footercol1">
                    <h5>our Location</h5>
                    <div class="smalladdress">
                        <p class="mainaddress">9870 St Vincent Place,<br>Glasgow, DC 45 Fr 45.</p>
                        <p>Freephone:<span>+1 800 559 6580</span></p>
                        <p>Telephone:<span>+1 800 603 6035</span></p>
                        <p>FAX:<span class="marginfax">+1 800 889 9898</span></p>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 maxheight1 footercol1">
                    <h5>Overview</h5>
                    <ul class="list5">
                        <li><a href="#">what we do</a></li>
                        <li><a href="#">sales for services</a></li>
                        <li><a href="#">Development Process</a></li>
                        <li><a href="#">Clients</a></li>
                        <li><a href="#">our team</a></li>
                        <li><a href="#">Blog</a></li>
                    </ul>

                </div>
                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 maxheight1 footercol1">
                    <h5 class="mbotform1">newsletter</h5>
                    <form id="form1">
                      <div class="success">Your subscribe request<br> has been sent!</div>
                        <fieldset>
                        <label class="email">
                            <input type="email" value="Enter Your Email">
                            <span class="error">*This is not a valid email address.</span></label>
                        <br class="clear">
                        <div class="btns"><a href="#" class="btn btn-primary btn-lg btn4" data-type="submit">Submit</a></div>
                      </fieldset>
                      </form>
                </div>
            </div>
        </div>
    </div>
    <div class="footerrow2">
        <div class="container">
            <p class="footerpriv" style="text-align:center">&copy; <span id="copyright-year"></span> <img src="img/linefooter.png" alt=""> <a class="privacylink" href="index-5.html">Privacy Policy</a></p>
        </div>
    </div> 
</footer>

如果我需要修改它,我需要修改每个 5 个 HTML 页面。我是一名 ASP.net MVC web 开发人员,我可以通过定义一个布局 View 轻松处理这个问题,每个 View 都包含所有共享部分。

所以我的问题是如何在我的网络模板的 HTML 页面中管理它?

最佳答案

答案是否定的*(带星号)。

*有some support in HTML5对于可包含的 HTML 但它是 very limited .

事实上,Firefox 的支持太少了……“没有计划支持 HTML 导入”……

您可能会幸运地使用 Web Components Library启用跨浏览器支持,但这可能比 5 页模板的值(value)更麻烦。

关于html - 在多个 HTML 页面中重复使用页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31899543/

相关文章:

javascript - 将 <li> 更改为 <span>?

html - 如何在包装器的左侧和右侧添加图像边框?

php - 如何像在同一页面上使用#符号一样继续特定的id yii2?

ASP.NET:向导控件的自定义布局

css - 如何在 MVC5 中切换 _Layout View

android - 布局文件 - 将项目定位到另一个项目的右侧 (Android)

javascript - 在没有定义高度的情况下垂直和水平居中 div

html - 标题中没有填充或边距

javascript - Bootstrap table toggle ...如果打开一个新的切换,如何关闭以前的切换?

java - 如何使用 Jsoup 添加新的 html 标签?