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

最新推荐文章于 2024-06-12 22:18:50 发布

sunshinegeorge

最新推荐文章于 2024-06-12 22:18:50 发布

阅读量1.5w

点赞数

文章标签： html border xhtml jsp xml

本文链接：https://blog.csdn.net/sunshinegeorge/article/details/1837232

版权

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.运行效果[如下图]

sunshinegeorge

关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
5
评论
HTML自定义标签开发入门实例

1.写在最前面自定义标签这个词大家不会陌生，但我们接触更多的是自定义JSP标签.本文介绍种自定义HTML标签的方法。在页面设计与布局的过程中，使用这种方法，将大大精简你的页面代码量并使你的代码极具个性，酷到极点.2.具体步骤2.1.声明标签在标签中进行这样的申明：，xmlns即xml name space的缩写。是HTML标记的命名空间属性:一般其声明在元素开始标记的地方。只要在这里申明了我要
复制链接

扫一扫