自定义html标记替换html5新增元素


Posted in HTML / CSS onOctober 17, 2008

在html 5增加了新元素header、footer,测试过发现IE不能解析html 5新增的元素。
代码如下:<!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>无标题文档</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>这里是顶部</header>
<footer>这里是尾部</footer>
</div>
</body>
</html>

用自定义标签可以解决浏览器兼容的问题
代码如下:
<!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>自定义html标签</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>这里是顶部</layout:header>
<layout:footer>这里是尾部</layout:footer>
</body>
</html>

HTML / CSS 相关文章推荐
基于css3仿造window7的开始菜单
Jun 17 HTML / CSS
45个非常奇妙的CSS3 特性应用示例
Jan 01 HTML / CSS
实现CSS3中的border-radius(边框圆角)示例代码
Jul 19 HTML / CSS
纯CSS实现颜色渐变效果(包含环形渐变、线性渐变、彩虹效果等)
May 07 HTML / CSS
CSS+jQuery+PHP+MySQL实现的在线答题功能
Apr 25 HTML / CSS
使用CSS3 制作一个material-design 风格登录界面实例
Dec 12 HTML / CSS
CSS3动画特效在活动页中的应用
Jan 21 HTML / CSS
详解css3中的伪类before和after常见用法
Nov 17 HTML / CSS
HTML5 Canvas自定义圆角矩形与虚线示例代码
Aug 02 HTML / CSS
HTML5新特性之用SVG绘制微信logo
Feb 03 HTML / CSS
Html5页面获取微信公众号的openid的方法
May 12 HTML / CSS
h5移动端调用支付宝、微信支付的实现
Jun 08 HTML / CSS
HTML5的结构和语义(1):前言
Oct 17 #HTML / CSS
HTML5的结构和语义(3):语义性的块级元素
Oct 17 #HTML / CSS
HTML5的结构和语义(2):结构
Oct 17 #HTML / CSS
HTML5的结构和语义(4):语义性的内联元素
Oct 17 #HTML / CSS
HTML5中语义化 b 和 i 标签
Oct 17 #HTML / CSS
HTML5的结构和语义(5):内嵌媒体
Oct 17 #HTML / CSS
HTML5的结构和语义(5):交互
Oct 17 #HTML / CSS
You might like
学习使用PHP数组
2006/10/09 PHP
动态生成gif格式的图像要注意?
2006/10/09 PHP
php的list()的一步操作给一组变量进行赋值的使用
2011/05/18 PHP
PHP和JAVA中的重载(overload)和覆盖(override) 介绍
2012/03/01 PHP
php中判断文件存在是用file_exists还是is_file的整理
2012/09/12 PHP
php简单实现数组分页的方法
2016/04/30 PHP
PHP中抽象类和抽象方法概念与用法分析
2016/05/24 PHP
thinkPHP内置字符串截取函数用法详解
2016/11/15 PHP
PHP删除二维数组中相同元素及数组重复值的方法示例
2017/05/05 PHP
JavaScript 对象的属性和方法4种不同的类型
2010/03/19 Javascript
浅谈javascript中的作用域
2012/04/07 Javascript
js字符串完全替换函数分享
2014/12/03 Javascript
jQuery中insertAfter()方法用法实例
2015/01/08 Javascript
jQuery实现网页抖动的菜单抖动效果
2015/08/07 Javascript
JQuery中Ajax()的data参数类型实例分析
2015/12/15 Javascript
nodejs简单实现操作arduino
2016/09/25 NodeJs
angular2+node.js express打包部署的实战
2017/07/27 Javascript
Angular中sweetalert弹框的基本使用教程
2018/07/22 Javascript
一看就会的vuex实现登录验证(附案例)
2020/01/09 Javascript
收藏整理的一些Python常用方法和技巧
2015/05/18 Python
Python如何判断数独是否合法
2016/09/08 Python
python版本五子棋的实现代码
2018/12/11 Python
Python爬虫之UserAgent的使用实例
2019/02/21 Python
python 环境搭建 及python-3.4.4的下载和安装过程
2019/07/20 Python
Python with关键字,上下文管理器,@contextmanager文件操作示例
2019/10/17 Python
python解释器pycharm安装及环境变量配置教程图文详解
2020/02/26 Python
Python itertools.product方法代码实例
2020/03/27 Python
PyCharm2019 安装和配置教程详解附激活码
2020/07/31 Python
Python自动化测试基础必备知识点总结
2021/02/07 Python
python 批量将中文名转换为拼音
2021/02/07 Python
使用css创建三角形 使用CSS3创建3d四面体原理及代码(html5实践)
2013/01/06 HTML / CSS
Nike加拿大官网:Nike.com (CA)
2019/04/09 全球购物
工程专业求职自荐书范文
2014/02/18 职场文书
超市仓管员岗位职责
2014/04/07 职场文书
《少年闰土》教学反思
2016/02/18 职场文书
vue实现可拖拽的dialog弹框
2021/05/13 Vue.js