静态html如何包括header和footer ?

html-css025

静态html如何包括header和footer ?,第1张

1.

新建一个html静态页,具备基本的页面结构,例如取名index.html,页面包含内容

<!doctype

html>

<html>

<head>

<meta

charset="utf-8">

<title>这就是个例子</title>

</head>

<body>

</body>

</html>

2.

在<body></body>标签中写入你想添加的h5的新标签,例如<header>这是header标签</header>,<nav>这是nav标签</nav>,<footer>这是footer标签</footer>....

3.

需要那个标签就添加那个标签进去

可以将footer的position属性设置为绝对定位(fixd或absolute),然后设置top、botum、left、right值即可。

在CSS中关于定位的内容是:position:relative | absolute | static | fixed。static 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。在本文流中,任何一个元素都被文本流所限制了自身的位置,但是通过CSS我们依然使得这些元素可以改变自己的位置,我们可以通过float来让元素浮动,我们也可以通过margin来让元素产生位置移动。

将footer写一个新的html文件。

如:

<div class="footer">

<iframe src="footer.html" frameborder="0" scrolling="no"></iframe>

</div>

如果你是使用动态语言jsp的话,就更好搞了。

<jsp:include page="footer.html" flush="true"/>

<%@ include file="footer.html" %>