|
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">
<!--
html,body {}{
height:100%;
}
body {}{
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url(images/ltbg02.jpg);
background-repeat: repeat-x;
}
#header{}{
height: 120px;
}
/**//*编辑地区，相对位置，要配置Z次序,不然可以被“大楼包围”*/
#editBody
{}{
position: relative;
z-index:9;
}
#middleLeft
{}{
width: 365px;
}
/**//*草地配景*/
#footerBg
{}{
background-image: url(images/BlgDownBg.jpg);
background-repeat: repeat-x;
background-position: bottom;
height: 150px;
}
/**//*
草地配景，中第一个Div用，
配置为相对位置，它内里的绝对定位样式就是以它的0，0点开始的了
高度必然要给，要不在 FireFox 表现不正常
*/
#footer{}{
position: relative;
height: 149px;
}
/**//*大楼，样式*/
#lefImg
{}{
position: absolute;
left: -2px;
bottom: 30px;
}
/**//*小楼楼，样式*/
#rimg
{}{
position: absolute;
right: 20px;
bottom: 150px;
}
#copyright{}{
position: absolute;
right: 30px;
bottom: 50px;
color: #FFFFFF;
}
.Test0 {}{
border: 1px solid #FFFF00;
}
-->
</style>
<!-- 假如小于便是ie6 -->
<!--[if lte IE 6]>
<style type="text/css">
.pngAlpha {
height: 1px;
width: 1px;
filter:expression(
this.style.filter = this.style.filter.indexOf("AlphaImageLoader")== -1 ? this.style.filter + "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingmethod=image )" : this.style.filter
);
}
</style>
<![endif]-->
</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" >
<!--留意，footer 样式应用在 td 是有题目的，傍边间的笔墨多的时辰，图片不会随着走-->
<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;
}
（编辑：湖南网）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
