xml css htc 的综合运用
作者:hutia 来源:蓝色理想 发布时间:2008-10-10 11:41:00
这几个技术都不是很新了,现在还拿出来说也就是为了教教新手了呵呵,各位大虾多多指正.
css之所以出现就是为了实现数据与数据的表现形式的分离, xml则是为了无限扩展数据结构本身的限制, htc(更准确的说是behavior)进一步的把代码与表现形式分离开了
之所以要把这些已经出现了若干年的东西重新翻出来说,是因为看到最近的xHTML验证似乎比较热,其实xHTML的目的也就是更好的向XML过渡,形成一种标准化的数据形式.数据与数据表达方式,数据表达方式中的行为与样式的分离正是为了更有效率的组织数据.
让我们来看一些例子
用层模拟小窗口的代码:
运行代码框
可以看到,这段内容里同时有需要表达的数据,数据样式和样式的行为模式,对于只关心数据本身的修改者来说,如此多的代码会造成阅读上的困扰.让我们用前面提到的技术重整一下
//抱歉这段代码不能直接执行,因为我没有地方放置需要引用的CSS和HTC文件
<html xmlns:x >
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<title>xWin HTC Demo
</title>
<link rel="stylesheet" type="text/css" href="sp/css/global.css">
</head>
<body>
<x:win width=200 top=300 left=100 title="我就是传说中那个超长的窗口标题" id="win1" oncontentready="alert();">
我就是传说中那个超长的窗口标题我就是传说
中那个超长的窗口标题我就是传说中那个超长的窗口
个超长的窗口标题我就是传说中那个超长的窗口标题
</x:win>
<x:win width=200 top=70 left=140 title="我就是传说中那个超长的窗口标题" id="win2">
我是窗口2<br>我是窗口2<br>我是窗口2<br>
我是窗口2<br>我是窗口2<br>我是窗口2<br>
</x:win>
<a href="javascript:win1.ShowHide();void(0);">win1</a>
<a href="javascript:win2.ShowHide();void(0);">win2</a>
</body>
</html>
这时候大家会很高兴的发现,页面变得如此简单,代码中基本上只有数据本身,几乎完全没有JS了,那么JS在哪里哪?下面是CSS文件:sp/css/global.css
x\:* {
behavior:url(sp/htc/global.htc);
font-Size:13px;
line-Height:13px;
background-Color:white;
color:#444;
}
数据的行为也算作数据的表达样式之一呵呵,那么我们再看看htc文件
//这个代码是我自己的一个比较大的htc中摘录出来的,还包括了一个细线select
运行代码框
至此我们彻底的将三者分开,对于并不精通脚本语言的页面设计者,他可以随意的修改htm页面而不用再担心会引起什么意料不到的后果,只需要用<x:win>就可以简单的作出一个窗口,就好像这是一个普通的HTML标记一样.以后如果希望修改使得窗口不能拖动,也只需要修改一个htc就可以改变所有的页面.数据的结构化将使网站的维护变得异常轻松.
![](https://www.aspxhome.com/images/zang.png)
![](https://www.aspxhome.com/images/jiucuo.png)
猜你喜欢
- 在 Go 语言中,map 是一种非常常见的数据类型,它可以用于快速地检索数据。Go 语言中的 map 与其他编程语言中的类似的数据类型相比,
- Python 正则表达式是什么学习 Python 正则表达式离不开 re 模块,所以本篇博客会配合 re 模块进行编写。re 库是 Pyth
- 什么是YOLOV4YOLOV4是YOLOV3的改进版,在YOLOV3的基础上结合了非常多的小Tricks。尽管没有目标检测上革命性的改变,但
- SuperSocket 信息: (SpnRegister) : Error 1355。&n
- 前言有的时候我们在查看数据库数据时,会看到乱码。实际上,无论何种数据库只要出现乱码问题,这大多是由于数据库字符集设定的问题。下面我们就介绍一
- 假设现有一张人员表(表名:Person),若想将姓名、身份证号、住址这三个字段完全相同的记录查找出来,使用1: SELECT p
- 背景考虑这样一种情况,产品同学希望达到以下功能:在我们的网页中有一个固定区域,这个区域会用于渲染从后端拉取的含有图片等资源的富文本字符串。他
- 接下来就是数据结构的第一部分,栈。栈是一种遵从后进先出原则(LIFO,全称为Last In First Out)的有序集合。栈顶永远是最新的
- 1005:创建表失败1006:创建数据库失败1007:数据库已存在,创建数据库失败1008:数据库不存在,删除数据库失败1009:不能删除数
- 一、闭包1.1 三要素 必须有一个内嵌函数内嵌函数必须引用外部函数中变量外部函数返回值必须是内嵌函数1.2 语法# 语法def 外部函数名(
- 本文实例为大家分享了PyQt5实现暗黑风格的计时器的具体代码,供大家参考,具体内容如下主要是学习多线程知识,使用的是QTime(),但是似乎
- 我和朋友都建了一个电子商务网站,大量的访问,频繁地建立和中断数据库连接,导致Web 数据库应用程序降低了数据库服务器的性能。但最近,朋友使用
- 举个简单的例子:(此仅限于修改change_form页面)原来的时候,change_form_list是包含这些按钮的:因为此页面继承了{%
- 本文实例为大家分享了python实现飞机大战的具体代码,供大家参考,具体内容如下初学Python,写了一个简单的Python小游戏。师出bi
- 1.元组的创建元组(tuple):元组本身是不可变数据类型,没有增删改查元组内可以存储任意数据类型t = (1,2.3,True,'
- PHP现在推出5.3.0版本了,不过下载的时候有几个不同版本选择。那就是VC6 X86和VC9 X86。首先我来解答:VC6是什么?VC6就
- 项目地址https://github.com/jonssonyan...开发工具 python 3.7.9pycharm 2019.3.5
- 本文实例为大家分享了python3实现qq邮箱登陆并发送邮件功能的具体代码,供大家参考,具体内容如下基于selenium,使用chrome浏
- Python 是一种高级的,动态的,多泛型的编程语言。Python代码很多时候看起来就像是伪代码一样,因此你可以使用很少的几行可读性很高的代
- 本文介绍了vue生成随机验证码的示例代码,分享给大家,具体如下:样式自调,最终效果如图:实现效果:点击右边input框会自动切换,如果输入的