HTML 样式代码在 JSP 文件中不起作用

我正在使用Eclipse Kepler创建一个Web应用程序，并尝试在开始我的功能之前设计我的jsp文件。当我将以下代码创建为基本的html文件时，可以在浏览器中以完美的设计打开它。但是当我

在带有附加

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

与前两行一样，文件将失去其所有位置样式。如果在 jsp 中运行代码，您会注意到边框和链接颜色保持不变，但所有内容都位于同一位置。

有人知道如何处理这个问题吗？谢谢。

<html>
<head>
<title>Home</title>
<style>
body {
background-image: url(Images/whitebg.jpg);
background-repeat: no-repeat;
background-size: 100%;
}
#container {
width: 900px;
margin: 0 auto;
font-family: "Trebuchet MS", Helvetica, sans-serif;
}
#header img {
position: absolute;
top: 80;
left: 72;
width: 200;
height: 50;
}
#container a:visited {
color: blue;
}
#container a:hover {
color: red;
}
#welcome {
position: absolute;
top: 20;
right: 100;
}
#logout {
position: absolute;
top: 20;
right: 20;
width: 50px;
height:25px;
}
#links {
position: absolute;
top: 200;
left: 72;
}
#links ul {
list-style-type: none;
padding: 5 10 5 10;
border: 2px solid red;
border-radius: 10px;
}
#links li {
padding: 10 0 25 0;
}
#feed {
position: absolute;
top: 100;
left: 400;
width: 800px;
height: 400px;
}
#feedtext {
width:800px;
height:400px;
overflow: scroll;
}
</style>
</head>
<body>
<div id='container'>
<div id='header'>
    <img src='Images/mPowerlogo.jpg'/>
</div>
<div id='welcome'>
    Welcome, User1
</div>
<div id='logout'>
    <a href=''>Logout</a>
</div>
<div id='links'>
    <ul>
    <li><a href=''>Timecard Management</a></li>
    <li><a href=''>User Management</a></li>
    <li><a href=''>Customer Management</a></li>
    <li><a href=''>Admin</a></li>
    <li><a href=''>Reports</a></li>
        </ul>
</div>
<div id='feed'>
    <p>Recent Activity:</p>
    <textarea id='feedtext' readonly>
    </textarea>
</div>
</div>

更改 0 以外的位置以粘附在它 "px" 上。

top: 20px;

或者删除 DOCTYPE，因为这需要 HTML/CSS 被认为是正确的（尽管它不是）。

提示：您也可以考虑在Java中使用"Windows-1252"。浏览器会将ISO-8859-1解释为Windows-1252（即使在Mac和Linux上也是如此）。并且会出现一些特殊字符，例如MS Word喜欢的逗号状引号。HTML-5使这种隐藏的功能成为官方规范。

使用<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">行，您将 html 版本从可能解析为 5 的内容（没有 doctype，您最终会使用某种怪癖模式，wchich 甚至适用于缺少 px 的样式）到 4.01 过渡。当你这样做时，就会发生这种情况。不同的版本 - 不同的结果。

您必须决定要使用哪个版本（如果 html 5 - 则使用 <!DOCTYPE html> ）。另外，我建议使用UTF而不是8859-1（但这是一个选项）。

尝试更改该行中的编码 <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> 。

相关内容

最新更新

热门标签：