自定义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让div随鼠标移动而抖动起来
Feb 10 HTML / CSS
CSS3 display知识详解
Nov 25 HTML / CSS
纯CSS3实现扇形动画菜单(简化版)实例源码
Jan 17 HTML / CSS
CSS3颜色值RGBA与渐变色使用介绍
Mar 06 HTML / CSS
使用HTML5捕捉音频与视频信息概述及实例
Aug 22 HTML / CSS
HTML5 与 XHTML2
Oct 17 HTML / CSS
html5实现的便签特效(实战分享)
Nov 29 HTML / CSS
基于HTML5代码实现折叠菜单附源码下载
Nov 27 HTML / CSS
HTML5 移动页面自适应手机屏幕四类方法总结
Aug 17 HTML / CSS
html5 冒号分隔符对齐的实现
Jul 31 HTML / CSS
网站性能延迟加载图像的五种技巧(小结)
Aug 13 HTML / CSS
CSS 左边固定宽右边自适应的6种方法
May 15 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
cmd下运行php脚本
2008/11/25 PHP
奇怪的PHP引用效率问题分析
2012/03/23 PHP
PHP快速按行读取CSV大文件的封装类分享(也适用于其它超大文本文件)
2014/04/10 PHP
ThinkPHP3.1新特性之查询条件预处理简介
2014/06/19 PHP
PHP接入微信H5支付的方法示例
2019/10/28 PHP
tp5.1 框架数据库-数据集操作实例分析
2020/05/26 PHP
javascript里的条件判断
2007/02/27 Javascript
JavaScript设置FieldSet展开与收缩
2009/05/15 Javascript
asp.net下使用jquery 的ajax+WebService+json 实现无刷新取后台值的实现代码
2010/09/19 Javascript
为jQuery添加Webkit的触摸的方法分享
2014/02/02 Javascript
easyui datagrid 键盘上下控制选中行示例
2014/03/31 Javascript
使用jquery选择器如何获取父级元素、同级元素、子元素
2014/05/14 Javascript
jQuery无刷新切换主题皮肤实例讲解
2015/10/21 Javascript
Vue 去除路径中的#号
2018/04/19 Javascript
vue自定义移动端touch事件之点击、滑动、长按事件
2018/07/10 Javascript
使用electron制作满屏心特效的示例代码
2018/11/27 Javascript
微信小程序实现工作时间段选择
2019/02/15 Javascript
序列化模块json代码实例详解
2020/03/03 Javascript
JS异步宏队列与微队列原理区别详解
2020/07/02 Javascript
[19:54]夜魇凡尔赛茶话会 第一期02:看图识人
2021/03/11 DOTA
python使用正则筛选信用卡
2019/01/27 Python
python mac下安装虚拟环境的图文教程
2019/04/12 Python
python3对接mysql数据库实例详解
2019/04/30 Python
Python面向对象多态实现原理及代码实例
2020/09/16 Python
HTML5拖拽功能实现的拼图游戏
2018/07/31 HTML / CSS
德国最大的婴儿用品网上商店:Kidsroom.de(支持中文)
2020/09/02 全球购物
Java面试题汇总
2015/12/06 面试题
Servlet如何得到服务器的信息
2015/12/22 面试题
学生喝酒检讨书
2014/02/06 职场文书
教师见习期自我鉴定
2014/04/28 职场文书
投标服务承诺书
2014/05/28 职场文书
品牌转让协议书
2014/08/20 职场文书
毕业生班级鉴定评语
2015/01/04 职场文书
大学校园招聘会感想
2015/08/10 职场文书
Win7/8.1用户可以免费升级到Windows 11系统吗?
2021/11/21 数码科技
MySQL分区路径子分区再分区
2022/04/13 MySQL