当前位置：首页 → 问答吧 → 请教一个关于<!DOCTYPE的问题

请教一个关于<!DOCTYPE的问题

时间：2009-12-11

来源：互联网

本帖最后由 jinjc 于 2009-12-12 12:16 编辑

test.jsp

<%@ page contentType="text/html;charset=gb2312"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>测试</title>
<link href="test.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div class=topnav>
<ul id=topnavlist>
<li><a href="../main.jsp">首    页</a></li>
<li><a href="addfh.jsp">售后发货</a></li>
<li><a href="jjqd.jsp">旧件清单</a></li>
<li><a href="rydt.jsp">人员动态</a></li>
<li><a href="grtz.jsp">个人台帐</a></li>
<li><a href="../index.jsp">退    出</a></li>
</ul>
<div id=toptext>部门： | 用户：</div>
</div>
</html>

复制代码

test.css

.topnav {
position: relative;
margin: 0 -10px 5px;
padding: 0 15px;
height: 2px;
line-height: 2;
background: #e7efff;
border-bottom: 1px solid #9cc3de;
font:12px;
}
#toptext{
float:right;
margin:0 auto;
line-height:30px;
color:#0000ff;
padding:4px 8px 4px 8px;
}
#topnavlist li{
float:left;
padding:4px 8px 4px 8px;
line-height:30px;
height:30px;
}
a:link,a:visited{
color:#0066CC;
text-decoration:none;
padding:4px 8px 4px 8px;
border-top: 1px solid #FFFFFF; /* 边框实现阴影效果 */
border-left: 1px solid #FFFFFF;
border-bottom: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}
a:hover{
color:#FFFFFF;
text-decoration:none;
padding:4px 8px 4px 8px;
background-color:#0099FF; /* 改变背景色 */
border-top: 1px solid #EEEEEE; /* 边框实现阴影效果 */
border-left: 1px solid #EEEEEE;
border-bottom: 1px solid #717171;
border-right: 1px solid #717171;
}
a:active{
color:#FFFFFF;
text-decoration:none;
padding:4px 8px 4px 8px;
background-color:#0066FF; /* 改变背景色 */
border-top: 1px solid #717171; /* 边框变换，实现“按下去”的效果 */
border-left: 1px solid #717171;
border-bottom: 1px solid #EEEEEE;
border-right: 1px solid #EEEEEE;
}

复制代码

在test.jsp页面中，如果有<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">这段代码，菜单的字体会变大。
如果删除这段代码，字体会还原到12px的大小。不知道为什么。

用jQuery做动画效果要求要在标准模式下，否则可能会引起动画抖动。
因为页面要有jquery动画效果，所以必须加上<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0代码行。
我现在希望在有<!DOCTYPE代码行的情况下，也要有12px的小字体，不知道怎么实现？

作者: jinjc 发布时间: 2009-12-11

请教一个关于<!DOCTYPE的问题

热门阅读

热门下载