您所在位置：主题：[原创]XHTML问题整理
pk4321
[专家分：690] 发布于 2006-11-12 01:37:00
将HTML转为XHTML 1.0的问题：
◆Content-Type问题
由于IE不支持“application/xhtml+xml”，所以你的ASP文件要这样：
[quote]
If InStr(1,Request.ServerVariables("HTTP_USER_AGENT"),"IE") Then
Response.ContentType="text/html"
Else
Response.ContentType="application/xhtml+xml"
End If
[/quote]
◆关于CSS和JS代码
在XHTML里<script>标签是不用language属性的，而且没有document.write这句的！
<script><style>中间的代码必须是CDATA，而不能像HTML那样用<!-- -->来注释：
[quote]
<script type="text/javascript">
// <![CDATA[
...
// ]]>
</script>
<style type="text/css">
/* <![CDATA[ */
...
/* ]]> */
</style>
[/quote]
◆关于特殊符号“&”，必须用“&”代替
例如：
[quote]
<a href="list.asp?id=5&page=1">下一页</a>
[/quote]
◆将表格的td的长宽替换为style
用正则表达式查找：
width="([0-9]+)" height="([0-9]+)"
替换为：
style="width:\1px;height:\2px"
或者查找：
<td (width|height)="([0-9]+)"
替换为：
<td style="\1:\2px"
◆新建窗口的链接
<a href="..." target="_blank">
改为：
<a href="..." rel="external">
并增加js脚本到<head>：
[quote]
<script type="text/javascript">
<!--//--><![CDATA[//><!--
function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i<anchors.length; i++) {
var anchor = anchors[ i ];
if (anchor.getAttribute("href") &amp;&amp;
anchor.getAttribute("rel") == "external")
anchor.target = "_blank";
} }
window.onload = externalLinks;
//--><!]]>
</script>
[/quote]
◆关于表单中的控件要在div中
[quote]
<form action="" method="post"><div id="" class="">
</div></form>
[/quote]
◆关于表格的居中对齐
<table style="text-align:center;margin:auto;" >
◆关于img问题（一定有alt，但不能有border）
<img src="" alt="" width="" height="" />
◆完美解决与第三方广告或统计的JS代码的兼容性
◇◇首先将第三方的JS代码放入一个新的HTML文件中
例如(ext.htm)：
[quote]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" >
<title>ads</title>
<style type="text/css">
body { margin: 0px; padding: 0px; font-size:12px; }
html,body { overflow: hidden; }
html>body { overflow: hidden; }
html { height: 100%;}
</style>
</head>
<body>
<script type="text/javascript" src="http://www.xxx.com/xxx.js" ></script>
</body>
</html>
[/quote]
◇◇然后在原XHTML中的<head>中加：
[quote]
<!-- 这部分是为了在非IE中良好显示的 -->
<style type="text/css">
/*<![CDATA*/
#obj_ext1 {width:770px;height:320px;margin-left:0px;margin-top:0px}
/*]]>*/
</style>
<!-- 这部分是为了在 IE 中良好显示的 -->
<!--[if IE]>
<style type="text/css">
/*<![CDATA*/
#obj_ext1 {width:774px;height:324px;margin-left:-2px;margin-top:-2px}
/*]]>*/
</style>
<![endif]-->
[/quote]
◇◇最后在原XHTML中要显示的地方div+object来引用：
[quote]
<div style="width:770px;height:320px;overflow:hidden;">
<object data="ext1.htm" type="text/html" id="obj_ext1" ></object>
</div>
[/quote]
代码的width和height的值请具体调试修改，其中div中的width和height的值是你想要的大小，而object的width和height的值必须比div的值加4即可。
模板请查考我的首页的源代码！ [url]http://www.lxasp.com/[/url]
◆Content-Type问题
由于IE不支持“application/xhtml+xml”，所以你的ASP文件要这样：
[quote]
If InStr(1,Request.ServerVariables("HTTP_USER_AGENT"),"IE") Then
Response.ContentType="text/html"
Else
Response.ContentType="application/xhtml+xml"
End If
[/quote]
◆关于CSS和JS代码
在XHTML里<script>标签是不用language属性的，而且没有document.write这句的！
<script><style>中间的代码必须是CDATA，而不能像HTML那样用<!-- -->来注释：
[quote]
<script type="text/javascript">
// <![CDATA[
...
// ]]>
</script>
<style type="text/css">
/* <![CDATA[ */
...
/* ]]> */
</style>
[/quote]
◆关于特殊符号“&”，必须用“&”代替
例如：
[quote]
<a href="list.asp?id=5&page=1">下一页</a>
[/quote]
◆将表格的td的长宽替换为style
用正则表达式查找：
width="([0-9]+)" height="([0-9]+)"
替换为：
style="width:\1px;height:\2px"
或者查找：
<td (width|height)="([0-9]+)"
替换为：
<td style="\1:\2px"
◆新建窗口的链接
<a href="..." target="_blank">
改为：
<a href="..." rel="external">
并增加js脚本到<head>：
[quote]
<script type="text/javascript">
<!--//--><![CDATA[//><!--
function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i<anchors.length; i++) {
var anchor = anchors[ i ];
if (anchor.getAttribute("href") &amp;&amp;
anchor.getAttribute("rel") == "external")
anchor.target = "_blank";
} }
window.onload = externalLinks;
//--><!]]>
</script>
[/quote]
◆关于表单中的控件要在div中
[quote]
<form action="" method="post"><div id="" class="">
</div></form>
[/quote]
◆关于表格的居中对齐
<table style="text-align:center;margin:auto;" >
◆关于img问题（一定有alt，但不能有border）
<img src="" alt="" width="" height="" />
◆完美解决与第三方广告或统计的JS代码的兼容性
◇◇首先将第三方的JS代码放入一个新的HTML文件中
例如(ext.htm)：
[quote]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" >
<title>ads</title>
<style type="text/css">
body { margin: 0px; padding: 0px; font-size:12px; }
html,body { overflow: hidden; }
html>body { overflow: hidden; }
html { height: 100%;}
</style>
</head>
<body>
<script type="text/javascript" src="http://www.xxx.com/xxx.js" ></script>
</body>
</html>
[/quote]
◇◇然后在原XHTML中的<head>中加：
[quote]
<!-- 这部分是为了在非IE中良好显示的 -->
<style type="text/css">
/*<![CDATA*/
#obj_ext1 {width:770px;height:320px;margin-left:0px;margin-top:0px}
/*]]>*/
</style>
<!-- 这部分是为了在 IE 中良好显示的 -->
<!--[if IE]>
<style type="text/css">
/*<![CDATA*/
#obj_ext1 {width:774px;height:324px;margin-left:-2px;margin-top:-2px}
/*]]>*/
</style>
<![endif]-->
[/quote]
◇◇最后在原XHTML中要显示的地方div+object来引用：
[quote]
<div style="width:770px;height:320px;overflow:hidden;">
<object data="ext1.htm" type="text/html" id="obj_ext1" ></object>
</div>
[/quote]
代码的width和height的值请具体调试修改，其中div中的width和height的值是你想要的大小，而object的width和height的值必须比div的值加4即可。
模板请查考我的首页的源代码！ [url]http://www.lxasp.com/[/url]
