自定义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气泡 css3关键帧动画创建的动态通知气泡
Feb 26 HTML / CSS
CSS3圆角边框和边界图片效果实例
Jul 01 HTML / CSS
利用css3如何设置没有上下边的列表间隔线
Jul 03 HTML / CSS
详解CSS3原生支持div铺满浏览器的方法
Aug 30 HTML / CSS
HTML5 placeholder属性详解
Jun 22 HTML / CSS
HTML5 File API改善网页上传功能
Aug 19 HTML / CSS
HTML中使用SVG与SVG预定义形状元素介绍
Jun 28 HTML / CSS
详解HTML5中的Communication API基本使用方法
Jan 29 HTML / CSS
完美解决IE8下不兼容rgba()的问题
Mar 31 HTML / CSS
如何用canvas实现在线签名的示例代码
Jul 10 HTML / CSS
使用html2canvas实现将html内容写入到canvas中生成图片
Jan 03 HTML / CSS
详解如何使用rem或viewport进行移动端适配
Aug 14 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
第一个无线电台是由谁发明的
2021/03/01 无线电
PHP设计模式 注册表模式(多个类的注册)
2012/02/05 PHP
php在window iis的莫名问题的测试方法
2013/05/14 PHP
PHP实现上传多图即时显示与即时删除的方法
2017/05/09 PHP
微信公众号实现会员卡领取功能
2017/06/08 PHP
php 多继承的几种常见实现方法示例
2019/11/18 PHP
优化 JavaScript 代码的方法小结
2009/07/16 Javascript
jQuery EasyUI API 中文文档 - EasyLoader 加载器
2011/09/29 Javascript
使用js实现一个可编辑的select下拉列表
2014/02/20 Javascript
js中window.open打开一个新的页面
2014/08/10 Javascript
仿百度换肤功能的简单实例代码
2016/07/11 Javascript
基于javascript实现按圆形排列DIV元素(一)
2016/12/02 Javascript
vue2 如何实现div contenteditable=“true”(类似于v-model)的效果
2017/02/08 Javascript
jQuery基于事件控制实现点击显示内容下拉效果
2017/03/07 Javascript
Vue脚手架编写试卷页面功能
2020/03/17 Javascript
js实现抽奖功能
2020/11/24 Javascript
利用JavaScript模拟京东按键输入功能
2020/12/01 Javascript
keep-alive保持组件状态的方法
2020/12/02 Javascript
编写Python爬虫抓取暴走漫画上gif图片的实例分享
2016/04/20 Python
python机器学习之随机森林(七)
2018/03/26 Python
python获取当前目录路径和上级路径的实例
2018/04/26 Python
Django基础知识与基本应用入门教程
2018/07/20 Python
详解Python list和numpy array的存储和读取方法
2019/11/06 Python
Python3爬虫关于识别点触点选验证码的实例讲解
2020/07/30 Python
python 提高开发效率的5个小技巧
2020/10/19 Python
菲律宾购物网站:Lazada菲律宾
2018/04/05 全球购物
天逸系统(武汉)有限公司Java笔试题
2015/12/29 面试题
同步和异步有何异同,在什么情况下分别使用他们?
2012/12/28 面试题
后勤部经理岗位职责
2014/02/23 职场文书
财务管理专业求职信
2014/06/11 职场文书
十岁生日答谢词
2015/01/05 职场文书
辩护词格式
2015/05/22 职场文书
西安事变观后感
2015/06/12 职场文书
小学数学继续教育研修日志
2015/11/13 职场文书
校园安全学习心得体会
2016/01/18 职场文书
python3+PyQt5+Qt Designer实现界面可视化
2021/06/10 Python