在Eclipse之外，通过双击index.html，它可以正常运行我的设计师给我的CSS和JS，但是当我将它复制并粘贴到Eclipse的目录中时，它只加载索引只有纯文本的页面，没有样式，但我确保链接看起来很好但是，锚标记没有链接到指定的HTML网站，它总是给出错误404，资源未找到错误。
文件夹
的WebContent * WEB-INF - web.xml * HTML -index.html -donate.html - 和其他HTML - 项目（文件夹） - 项目1 - 项目2 - 项目3 * CSS -bootstrap css元素 * JS -bootstrap js elements
这里是index.html的代码
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>People Helping People Foundation</title>
<link href="../CSS/bootstrap.css" rel="stylesheet" type='text/css' />
<link href="../CSS/main.css" rel="stylesheet" />
</head>
<body data-spy="scroll" data-target="#navbarCollapse">
<nav role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class='container-fluid'>
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="index.html" class="navbar-brand">People Helping People</a>
</div>
<!-- Collection of nav links, forms, and other content for toggling -->
<div id="navbarCollapse" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#imageHead">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contactUs">Contact Us</a></li>
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle" href="#">Projects <b class="caret"></b></a>
<ul role="menu" class="dropdown-menu">
<li><a href="Projects/project_1.html" class="transition">Project 1</a></li>
<li><a href="Projects/project_2.html" class="transition">Project 2</a></li>
<li><a href="Projects/project_3.html" class="transition">Project 3</a></li>
<!--<li class="divider"></li>
<li><a href="#">Trash</a></li>-->
</ul>
</li>
<li><a href="donate.html">Donate</a></li>
</ul>
<!--<form role="search" class="navbar-form navbar-left">
<div class="form-group">
<input type="text" placeholder="Search" class="form-control">
</div>
</form>-->
<ul class="nav navbar-nav navbar-right">
<li id='loginSpace_admin' class='hidden'>
<div class='container-fluid'>
<div class='row'>
<div class='col-xs-12'>
<p style='margin-top: 1px;'><em>Welcome back,</em> <span id='navLink'>Username</span>!</p>
<p style='margin-top: -15px;'><em>Last active on</em> <span id='navLink'>date</span></p>
<p style='margin-top: -15px;margin-bottom: inherit;'><span id='navLink'><a href='donations_panel.html'>Donations</a></span> | <span id='navLink'><a href='admin-content-wp/donation_log_wp.html'>ACP</a></span> | <span id='navLink'>Log Out!</span></p>
</div>
</div>
</div>
</li>
<li id='loginSpace_user' class='hidden'>
<div class='container-fluid'>
<div class='row'>
<div class='col-xs-12'>
<p style='margin-top: 1px;'><em>Welcome back,</em> <span id='navLink'>Username</span>!</p>
<p style='margin-top: -15px;'><em>Last active on</em> <span id='navLink'>date</span></p>
<p style='margin-top: -15px;margin-bottom: inherit;'><span id='navLink'><a href='donations_panel.html'>Your Donations</a></span> | <span id='navLink'>Log Out!</span></p>
</div>
</div>
</div>
</li>
</ul>
<ul class="nav navbar-nav navbar-right " id='loginSpace'>
<li id='bLogin' onclick='logn()'><a href='javascript:void(0)'>Login</a></li>
<li id='aOr' class='hidden-xs hidden-sm' style='margin-left: -20px;margin-right: -20px;'><a href='javascript:void(0)'>or</a></li>
<li id='sgnUp'><a href='sign_up.html'>Sign Up!</a></li>
<li id='aLogin' class='hidden'>
<div class='row'>
<div class='col-xs-9 col-xs-offset-1'>
<form onSubmit='return showPanel()'>
<div class="form-group">
<input type="userID" class="form-control" id="loginInput_1" placeholder="User ID">
<input type="password" class="form-control" id="loginInput_2" placeholder="Password">
</div>
</div>
<div class='col-xs-1'>
<div class="form-group">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</form>
</div>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- FIREFOX SETTING: security.fileuri.strict_origin_policy to false -->
<div id='imageHead'></div>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="../MEDIA/IMAGES/jumbo-image.png" alt="IMAGE 1" style='height: inherit;'>
</div>
<div class="item">
<img src="../MEDIA/IMAGES/jumbo-image.png" alt="IMAGE 2" style='height: inherit;'>
</div>
<div class="item">
<img src="../MEDIA/IMAGES/jumbo-image.png" alt="IMAGE 3" style='height: inherit;'>
</div>
<div class="item">
<img src="../MEDIA/IMAGES/jumbo-image.png" alt="IMAGE 4" style='height: inherit;'>
</div>
</div>
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<div class='container-fluid'>
<div class='container'>
<div class='row vwContent' id='about'> <!-- content1 -->
<div class='row well-lg'>
<div class='col-xs-12 hidden-xs hidden-sm'>
<h1>Who we are.</h1>
</div>
<div class='col-xs-12 hidden-md hidden-lg'>
<h1 class='text-center'>Who we are.</h1>
</div>
</div>
<div class='row'>
<div class='col-md-5'>
<img src='../MEDIA/IMAGES/727x519.png' class='img-responsive'/>
</div>
<div class='col-md-7 col-xs-12'>
<p class='lead text-justify'>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed molestie pharetra justo gravida commodo. Aenean consectetur ligula vitae ligula suscipit luctus. Curabitur venenatis purus risus, aliquam placerat ipsum tempus eu. Morbi lobortis lacus diam, gravida laoreet sem gravida ac. Integer tempus dui arcu, at rutrum elit tincidunt nec. Aenean bibendum eros risus, non interdum metus imperdiet quis. Maecenas a tellus tortor. Phasellus rhoncus posuere faucibus. Ut cursus ligula eu venenatis facilisis. Suspendisse potenti. Aenean gravida neque nunc, sit amet consequat nisl faucibus eu. Proin molestie odio elementum aliquam egestas. Cras cursus tristique tincidunt.
</p>
</div>
</div>
<div class='row'>
<div class='col-xs-12'>
<p class='text-justify'>
Vivamus pellentesque nisl at neque blandit, non pretium felis feugiat. Aliquam malesuada, ligula sit amet ornare pulvinar, neque metus pharetra libero, quis fermentum mauris mi ut felis. Cras condimentum odio nec posuere porttitor. Aliquam et mollis neque. Sed mollis euismod augue ut imperdiet. Maecenas sit amet porttitor eros. Nulla nunc odio, suscipit ut aliquet eu, congue ac tortor. Integer molestie turpis est, quis posuere mi dapibus et. Sed vitae lectus convallis, hendrerit turpis sit amet, egestas velit. Pellentesque quis lectus ut odio euismod sollicitudin ultrices a neque. Donec elit felis, volutpat sit amet turpis sed, tincidunt placerat enim. Quisque blandit sapien quam, dapibus viverra massa rhoncus eu. Nulla mollis felis ac gravida hendrerit. Phasellus nisl enim, blandit eget lorem eu, dignissim blandit risus. Donec imperdiet tellus id arcu faucibus dapibus id id metus. Curabitur at lacinia mauris.
</p>
</div>
</div>
</div> <!-- content1 -->
<div class='row vwContent'> <!-- content2 -->
<div class='row'>
<div class='col-xs-12'>
<img src='../MEDIA/IMAGES/jumbo-image.png' class='img-responsive'>
</div>
</div>
<div class='row'>
<div class='col-xs-12'>
<p class='lead text-center'>
Sed nec viverra felis. Ut fermentum vitae sapien dignissim dignissim. Nullam ex massa, suscipit eu augue vel, tristique pulvinar massa. Nullam aliquet diam augue, id condimentum arcu ultricies eget. Fusce ante enim, consequat sed metus sit amet, interdum convallis diam. Aenean pretium diam a ex bibendum bibendum. In accumsan dui sit amet elit fringilla tincidunt. In nec vulputate elit. Nullam auctor ex et odio lobortis dignissim. Fusce et cursus mauris.
</p>
</div>
</div>
</div> <!-- content2 -->
<br />
<div class='row vwContent' id='contactUs'> <!-- content3 -->
<div class='row well-lg'>
<div class='col-xs-12'>
</div>
</div>
<div class='row'>
<div class='col-md-6 col-xs-12'>
<img src='../MEDIA/IMAGES/727x519.png' class='img-responsive'/>
</div>
<div class='col-md-6 col-xs-12'>
<div class='hidden-md hidden-lg'>
<br />
</div>
<h1 style='margin-top: -1vh;'>CONTACT US!</h1>
<form>
<div class="form-group">
<label for="Name">Name</label>
<input type="name" class="form-control" id="nameInput" placeholder="Enter Name">
</div>
<div class="form-group">
<label for="email">E-Mail Address</label>
<input type="email" class="form-control" id="emailInput" placeholder="Enter E-Mail">
</div>
<div class="form-group">
<label for="subject">Subject</label>
<input type="subject" class="form-control" id="subjectInput" placeholder="Enter Subject">
</div>
<div class="form-group">
<textarea class="form-control" rows="3" placeholder="Enter Message"></textarea>
<button type="submit" class="btn btn-default">Submit</button>
</div>
</form>
</div>
<div class='col-xs-12'>
<p class='text-info'>
Sed nec viverra felis. Ut fermentum vitae sapien dignissim dignissim. Nullam ex massa, suscipit eu augue vel, tristique pulvinar massa. Nullam aliquet diam augue, id condimentum arcu ultricies eget. Fusce ante enim, consequat sed metus sit amet, interdum convallis diam. Aenean pretium diam a ex bibendum bibendum. In accumsan dui sit amet elit fringilla tincidunt. In nec vulputate elit. Nullam auctor ex et odio lobortis dignissim. Fusce et cursus mauris.
</p>
</div>
</div>
</div> <!-- content3 -->
</div>
</div>
<div id="footer">
<div class="container">
<p class="text-muted"><em>Web User Interfaced designed by <a href="http://www.facebook.com/whenlegendbegins">Kyle Cancio</a></em></p>
</div>
</div>
</body>
<script src='../JS/jquery.js' type='text/javascript' /></script>
<script src="../JS/jquery.viewportchecker.js" type ='text/javascript'></script>
<script src='../JS/bootstrap.js' type='text/javascript' /></script>
<script src='../JS/custom_.js' type='text/javascript' /></script>
</html>