您的位置：首页 > Web前端 > HTML

HTML自定义标签开发入门实例

2007-10-22 14:55 465 查看

1.写在最前面
自定义标签这个词大家不会陌生，但我们接触更多的是自定义JSP标签.本文介绍种自定义HTML标签的方法。在页面设计与布局的过程中，使用这种方法，将大大精简你的页面代码量并使你的代码极具个性，酷到极点.

2.具体步骤
2.1.声明标签
在<html>标签中进行这样的申明：<html xmlns:huangyu>，xmlns即xml name space的缩写。是HTML标记的命名空间属性:一般其声明在元素开始标记的地方。只要在这里申明了我要使用的<huangyu/>这一自定义标签，语法分析器就会认识这个标签并赋予我定义的属性了。
2.2.定义自定义标签样式属性
<style type="text/css">
suntear/:my{border:1px solid #ccc;background-color:#efefef;font-weight:bold;}
suntear/:your{border:1px solid red;background-color: #FFF5F4;font-weight:bold;}
</style>
2.3.使用自定义标签
<huangyu:sorry>对不起,</huangyu:sorry>
<huangyu:love>我爱你!</huangyu:love>

3.完整的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:huangyu>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>自定义HTML标签</title>
<style type="text/css">
huangyu/:sorry{border:1px solid #ccc;background-color:#efefef;font-weight:bold;}
huangyu/:love{border:1px solid red;background-color: #FFF5F4;font-weight:bold;}
</style>
</head>
<body>
<huangyu:sorry>对不起,</huangyu:sorry>
<huangyu:love>我爱你!</huangyu:love>
</body
</html>

4.运行效果[如下图]

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： html border xhtml jsp xml

相关文章推荐

新的分享

章节导航