1、什么是是XHTML?
HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言,看起来与HTML有些相象,只有一些小的但重要的区别,XHTML就是一个扮演着类似HTML的角色的XML,所以,本质上说,XHTML是一个过渡技术,结合了XML(有几分)的强大功能及HTML(大多数)的简单特性。
2000年底,国际W3C(World Wide Web Consortium)组织公布发行了XHTML 1.0版本。XHTML 1.0是一种在HTML 4.0基础上优化和改进的的新语言,目的是基于XML应用。XHTML是一种增强了的HTML,它的可扩展性和灵活性将适应未来网络应用更多的需求。下面是W3C的HTML工作组主席Steven Pemberton回答的关于XHTML的常见基础问题。
问:什么是XHTML?
答:XHTML是一种为适应XML而重新改造的HTML。当XML越来越成为一种趋势,就出现了这样一个问题:如果我们有了XML,我们是否依然需要HTML?为了回答这个问题,1998年5月我们在旧金山开了两天的工作会议,会议的结论是:需要。我们依然需要使用HTML。因为大量的人们已经习惯使用HTML来作为他们的设计语言,而且,已经有数以百万计的页面是采用HTML编写的。
问:为什么XHTML 1.0相对HTML 4.0独立发展?
答:并不是这样。XHTML恰恰就是HTML 4.0的重新组织,(确切的说它是HTML 4.01,是一个修正版本的HTML 4.0,只不过以XHTML 1.0命名发行。) 它们在XML里的解释会有一些必要的差别,但另一方面,它们依然非常相似,我们可以把XHTML的工作看作是HTML 4.0基础上的延续。
问:XHTML 1.0如何实现XML标准?
答:XHTML就是一种XML应用。它采用XML的DTD文件格式定义,并运行在支持XML的系统上。这里要感谢XML的Namespaces功能,浏览器制造商不需要再创造新的私有标签(tags),他们只需要在XHTML代码里包含XML代码片段,或者XML代码里包含XHTML代码片段。
2、与HTML相比XHTML有什么特点?
(1)XHTML解决HTML语言所存在的严重制约其发展的问题。HTML发展到今天存在三个主要缺点:不能适应现在越多的网络设备和应用的需要,比如手机、PDA、信息家电都不能直接显示HTML;由于HTML代码不规范、臃肿,浏览器需要足够智能和庞大才能够正确显示HTML;数据与表现混杂,这样你的页面要改变显示,就必须重新制作HTML。因此HTML需要发展才能解决这个问题,于是W3C又制定了XHTML,XHTML是HTML向XML过度的一个桥梁。
(2)XML是web发展的趋势,所以人们急切的希望加入XML的潮流中。XHTML是当前替代HTML4标记语言的标准,使用XHTML 1.0,只要你小心遵守一些简单规则,就可以设计出既适合XML系统,又适合当前大部分HTML浏览器的页面。这个意思就是说,你可以立刻设计使用XML,而不需要等到人们都使用支持XML的浏览器。这个指导方针可以使web平滑的过渡到XML。
(3)使用XHTML的另一个优势是:它非常严密。当前网络上的HTML的糟糕情况让人震惊,早期的浏览器接受私有的HTML标签,所以人们在页面设计完毕后必须使用各种浏览器来检测页面,看是否兼容,往往会有许多莫名其妙的差异,人们不得不修改设计以便适应不同的浏览器。
(4)XHTML是能与其它基于XML的标记语言、应用程序及协议进行良好的交互工作。。
(5)XHTML是Web标准家族的一部分,能很好在无线设备等其它用户代理上。
(6)在网站设计方面,XHTML可助你去掉表现层代码的恶习,帮助你养成标记校验来测试页面工作的习惯。
翻译:阿捷
原文作者:Roger Johansson
作者简介:住在瑞典哥德堡,1994年开始接触和参与web设计,456 Berea Street是他的住址,因此采用这个名字作为他的个人主页域名
最近,经常有朋友问我一些工作中遇到的CSS问题。他们总是不能很好的控制CSS,影响CSS的效率发挥。我来分析总结一下错误所在,帮助大家更加容易使用CSS。
本文总结了我开始使用CSS布局方法以来所有的技巧和兼容方案,我愿意把这些与你分享,我会重点解释一些新手容易犯的错误(包括我自己也犯过的),如果你已经是CSS高手,这些经验技巧可能已经都知道,如果你有更多的,希望可以帮我补充。
一.使用css缩写
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。css缩写的主要规则请参看《常用css缩写语法总结》,这里就不展开描述。
二.明确定义单位,除非值为0
忘记定义尺寸的单位是CSS新手普遍的错误。在HTML中你可以只写width="100",但是在CSS中,你必须给一个准确的单位,比如:width:100px width:100em。只有两个例外情况可以不定义单位:行高和0值。除此以外,其他值都必须紧跟单位,注意,不要在数值和单位之间加空格。
三.区分大小写
当在XHTML中使用CSS,CSS里定义的元素名称是区分大小写的。为了避免这种错误,我建议所有的定义名称都采用小写。
class和id的值在HTML和XHTML中也是区分大小写的,如果你一定要大小写混合写,请仔细确认你在CSS的定义和XHTML里的标签是一致的。
四.取消class和id前的元素限定
当你写给一个元素定义class或者id,你可以省略前面的元素限定,因为ID在一个页面里是唯一的,而clas s可以在页面中多次使用。你限定某个元素毫无意义。例如:
div#content { /* declarations */ }
fIEldset.details { /* declarations */ }
可以写成
#content { /* declarations */ }
.details { /* declarations */ }
这样可以节省一些字节。
五.默认值
通常padding的默认值为0,background-color的默认值是transparent。但是在不同的浏览器默认值可能不同。如果怕有冲突,可以在样式表一开始就先定义所有元素的margin和padding值都为0,象这样:
* {
margin:0;
padding:0;
}
这是一个比较典型的三行二列布局,每列高度(事先并不能确定哪列的高度)的相同,是每个设计师追求的目标,按一般的做法,大多采用背景图填充、加JS脚本的方法使列的高度相同,本文要介绍的是采用容器溢出部分隐藏和列的负底边界和正的内补丁相结合的方法来解决列高度相同的问题。
先看代码:
#wrap{
overflow: hidden;
}
#sideleft, #sideright{
padding-bottom: 32767px;
margin-bottom: -32767px;
}
实现原理:
块元素必须包含在一个容器里。
应用overflow: hidden 到容器里的元素。
应用 padding-bottom(足够大的值)到列的块元素 。
应用margin-bottom(足够大的值)到列的块元素。
padding-bottom将列拉长变的一样高,而负的margin-bottom又使其回到底部开始的位置,同时,溢出部分隐藏掉了。
兼容各浏览器
IE Mac 5
得到高度正确,所以要过滤掉上面的代码。
/**/
#sideleft, #sideright{
padding-bottom: 32767px;
margin-bottom: -32767px;
}
/**/
Opera
1. Opera7.0-7.2不能正确清除溢出部分,所以要加:
/* easy clearing */
#wrap:after
{
content: '[DO NOT LEAVE IT IS NOT REAL]';
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#wrap
{
display: inline-block;
}
/**/
#wrap
{
display: block;
}
/* end easy clearing */
/**/



