Comments: Added the new element header and footer in html 5. The test showed that IE could not parse the new element in html 5. The Code is as follows: <! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Title> untitled document </title>
<Style type = "text/css">
<! --
*{
Margin: 0;
Padding: 0;
}
Header {
Background: #090;
Font-weight: bold;
Position: absolute;
Top: 10px;
}
Footer {
Background: # f90;
Font-weight: bold;
Position: absolute;
Bottom: 10px;
}
-->
</Style>
</Head>
<Body>
<Header> here is the top <Footer> here is the end </footer>
</Div>
</Body>
</Html>
Use custom tags to solve browser compatibility problems
The Code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns: layout>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Title> Custom html tag </title>
<Style type = "text/css">
<! --
*{
Margin: 0;
Padding: 0;
}
Layout \: header {
Background: #090;
Font-weight: bold;
Position: absolute;
Top: 10px;
}
Layout \: footer {
Background: # f90;
Font-weight: bold;
Position: absolute;
Bottom: 10px;
}
-->
</Style>
</Head>
<Body>
<Layout: header> here is the top </layout: header>
<Layout: footer> here is the end </layout: footer>
</Body>
</Html>