程序员人生网站导航

HTML 4.01、XHTML 1.0 Strict和Transitional 的区别

栏目：htmlcss时间：2013-12-22 13:49:11

XHTML——这个被认为是HTML 4的继任者，是HTML和XML的结合体。通过结合 XML和HTML的功能，XHTML使得Web内容更易于被电话、手持设备以及电视等访问。W3C将XHTML 1.0分为三种规范：Strict（严格）、Transitional（过渡）和Frameset（框架）。
XHTML 1.0 Strict（严格）

XHTML 1.0 Strict是需求最苛刻的XHTML规范，但是它提供了最干净的结构化标记。Strict编码独立于任何定义外观的标记语言。它使用层叠样式表（CSS）来控制表示外观。这种与表示相独立的结构使得XHTML Strict能够相当灵活地在不同的设备上显示。而其控制和表示对于CSS的依赖对于程序员来说又是一个麻烦，因为如果想要在那些不能识别样式表的设备或浏览器中显示Web内容，它并不是一个好的选择。

XHTML 1.0（过渡）
XHTML 1.0 Transitional是更加宽容的规范。Strict完全将结构与表示分离，而Transitional允许使用标签来控制外观。它的目的是要在允许用标记来控制表示的HTML页面和二者完全分离的XHTML Strict之间架起桥梁。它最大的好处是克服了Strict对于CSS的依赖。Transitional页面对于使用旧式浏览器或不能识别样式表的用户来说也是可以访问的。

如何选择？
在Strict和Transitional之间进行选择的时候，要参考几个因素：

用户。如果你的大多数用户都使用不能是别样式表的旧式浏览器，那就不能使用Strict——尽管我会举出支持标准比向后兼容更重要的例子。如果你的大多数用户使用的是最新版本的Internet Explorer、Netscape、Opera或者Safari，Strict就是最佳的长期选择。
当前代码。如果已经使用了CSS而且HTML中并不包含很多控制外观的标记，那么也可以上一个层次使用Strict。
开始
XHTML 1.0是基于HTML的，因此它能够被现存的浏览器所解释。那意味着可以立即开始使用XHTML。另外不管是转换一个已经存在的站点还是建立新的代码，都可以使用工具来获得帮助。

顺便分享个不错的代码
这个代码有待改进。

Code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>网</title>
<style type="text/css">

</style>




</head>

<body >
<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" valign="middle" id="header" class="Test0" > </td>
</tr>
<tr>
<td id="middleLeft" class="Test0" > </td>

<td valign="top" id="middleRight" >
<div id="editBody" >
<p>测试</p>
<p>测试</p>
<p>测试</p>
<p><a href="#">测试</a></p>
</div>
</td>
</tr>
<tr >
<td id="footerBg" colspan="2" valign="bottom" class="Test0" >

<div id="footer" >
<img id="lefImg" src="images/home_t_01.png" class="pngAlpha Test0">
<img id="rimg" src="images/home_t_02.gif" class="Test0">
<div id="copyright" class="Test0" >版权：曲滨 2006 ，Emai:XXXXXX</div>
</div>
</td>
</tr>
</table>
</body>
</html>

这个是改进后的代码
html: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" >
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>网</title>
<link rel="stylesheet" href="css.css" />
</head>
<body>
<div id="content">
<p>测试</p>
<p>测试</p>
</div>
<div id="footer">
<div id="decoration_left"></div>
<div id="decoration_right"></div>
<div id="copyright">版权：Yok 2006 ，Emai:XXXXXX</div>
</div>
</body>
</html>

CSS代码：
css: body
{
background-image:url(images/ltbg02.jpg);
background-repeat:no-repeat;
margin:0px;
padding:0px;
height:100%;
}

#content
{
margin-top:118px;
margin-left:366px;
}

#footer
{
background-image:url(images/BlgDownBg.jpg);
height:150px;
position:absolute;
bottom:0px;
width:100%;
}

#decoration_left
{
background-image:url(images/home_t_01.png);
background-repeat:no-repeat;
height:445px;
width:722px;
top:-330px;
position:absolute;
}

#decoration_right
{
background-image:url(images/home_t_02.gif);
background-repeat:no-repeat;
height:55px;
width:118px;
position:absolute;
top:-50px;
right:10px;
}

#copyright
{
position:absolute;
top:50px;
right:10px;
color:White;
width:270px;
}

------分隔线----------------------------

上一篇 MySQL字符集：怎样才能保证不发生乱码

下一篇 网页文字应用CSS的一些技巧

------分隔线----------------------------