自定义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 相关文章推荐
纯CSS打造(无图像无js)的非常流行的讲话(语音)气泡效果
Dec 28 HTML / CSS
CSS3实现的闪烁跳跃进度条示例(附源码)
Aug 19 HTML / CSS
利用CSS3的特性改变文本选中时的颜色
Sep 11 HTML / CSS
html5中localStorage本地存储的简单使用
Jun 16 HTML / CSS
HTML5实现晶莹剔透的雨滴特效
May 14 HTML / CSS
详解html5 shiv.js和respond.min.js
Jan 24 HTML / CSS
canvas拼图功能实现代码示例
Nov 21 HTML / CSS
使用html5实现表格实现标题合并的实例代码
May 13 HTML / CSS
HTML5 body设置全屏背景图片的示例代码
Dec 08 HTML / CSS
html实现弹窗的实例
Jun 09 HTML / CSS
postman中form-data、x-www-form-urlencoded、raw、binary的区别介绍
Jan 18 HTML / CSS
使用CSS定位HTML元素的实现方法
Jul 07 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
Gregarius中文日期格式问题解决办法
2008/04/22 PHP
PHP mb_convert_encoding 获取字符串编码类型实现代码
2009/04/26 PHP
php判断两个日期之间相差多少个月份的方法
2015/06/18 PHP
PHP创建XML接口示例
2019/07/04 PHP
javaScript 简单验证代码(用户名,密码,邮箱)
2009/09/28 Javascript
JS+CSS实现仿msn风格选项卡效果代码
2015/10/22 Javascript
JavaScript中利用各种循环进行遍历的方式总结
2015/11/10 Javascript
BootStrap制作导航条实例代码
2016/05/06 Javascript
JavaScript仿网易选项卡制作代码
2016/10/06 Javascript
jQuery.datatables.js插件用法及api实例详解
2016/10/28 Javascript
简单实现JS计算器功能
2016/12/21 Javascript
mac中利用NVM管理不同node版本的方法详解
2017/11/08 Javascript
js捆绑TypeScript声明文件的方法教程
2018/04/13 Javascript
node上的redis调用优化示例详解
2018/10/30 Javascript
Cocos2d实现刮刮卡效果
2018/12/20 Javascript
微信小程序HTTP接口请求封装的实现
2019/02/21 Javascript
JS模拟浏览器实现全局搜索功能
2019/09/11 Javascript
解决vue一个页面中复用同一个echarts组件的问题
2020/07/19 Javascript
Element InfiniteScroll无限滚动的具体使用方法
2020/07/27 Javascript
uwsgi+nginx部署Django项目操作示例
2018/12/04 Python
python实现坦克大战游戏 附详细注释
2020/03/27 Python
python threading和multiprocessing模块基本用法实例分析
2019/07/25 Python
使用 Python 清理收藏夹里已失效的网站
2019/12/03 Python
flask实现验证码并验证功能
2019/12/05 Python
python模式 工厂模式原理及实例详解
2020/02/11 Python
使用Python和百度语音识别生成视频字幕的实现
2020/04/09 Python
python使用自定义钉钉机器人的示例代码
2020/06/24 Python
Python 多进程原理及实现
2020/12/21 Python
第一范式(1NF)、第二范式(2NF)和第三范式(3NF)之间的区别是什么?
2016/04/28 面试题
法学院方阵解说词
2014/01/29 职场文书
环保标语大全
2014/06/12 职场文书
高职教师先进事迹材料
2014/08/24 职场文书
2014年团支书工作总结
2014/11/14 职场文书
2014年销售部工作总结
2014/12/01 职场文书
PyTorch的Debug指南
2021/05/07 Python
《金肉人》米特&《航海王》阿鹤声优松岛实因胰脏癌去世 享寿81岁
2022/04/13 日漫