我正在使用在线找到的模板构建网页，我在网页上的所有htmls都会参考我的样式页面。它就像我希望它在Chrome中一样（我也假设在Safari和Firefox中但尚未检查），但在Internet Explorer中，index.html似乎根本不想访问样式页面，而default_controls.html只是部分。我没有使用很多模板的样式页面，使得很多样式页面已经过时了。也可能是网页还没有发布。我是一个很新的HTML（我更像是一个Java人），但如果可能请帮助！
我的样式页面：
<!--/*-------------------------------------------------
GLOBALS CLASSES
-------------------------------------------------*/-->
*{padding:0; margin:0;}
body{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#1491c1; background:url(../images/bg.jpg) repeat;}
img{border:none;}
h1{ font-family: 'Droid Serif', serif; font-weight:normal; color:#fff;}
h2{ font-family: 'Droid Serif', serif; font-weight:normal; color:#1491c1; font-size:18px;}
P{ line-height:20px;}
a{text-decoration:none; color:#1491c1;}
a:hover{color:#fff;}
<!--/*-------------------------------------------------
GENERAL CLASSES
-------------------------------------------------*/-->
.mar-top{ margin-top:40px;}
.mar-top30{ margin-top:30px;}
.mar-bottom{ margin-bottom:40px;}
.mar-Right{ margin-right:40px;}
.mar-right115{ margin-right:115px;}
.float-left{ float:left;}
.float-right{ float:right;}
.clearing { clear:both;}
.bor-bottm-non{border-bottom:none!important;}
.panel{}
.title{}
.content{}
.wrap{width:960px; margin:0 auto;overflow:hidden; background:url(../images/page-bg.jpg);}
.page{ width:580px; margin:0 auto;overflow:hidden; padding-bottom:50px;}
.page-content{ width:580px; margin:0 auto;overflow:hidden; padding-bottom:30px; padding-top:30px;}
.block{padding:20px 20px 20px 20px; margin:0 auto;}
.block2{padding:20px 20px 20px 20px; margin:0 auto;}
.button a{text-decoration:none; display:block; width:70px; height:30px; background:#1491c1; color:#ffffff; font-family:Arial, Helvetica, sans-serif; line-height:30px; text-align:center;}
.button a:hover{ background:#0e5295;}
<!--/*-------------------------------------------------
CONTENT CLASSES
-------------------------------------------------*/-->
.page-content{ width:580px; margin:0 auto;overflow:hidden; padding-bottom:30px; padding-top:30px;}
.page-content .content h3{ padding-bottom:20px;font-family: 'Droid Serif', serif; font-weight:normal; color:#fff; font-size:16px;}
.page-content .content p{ padding-bottom:15px;}
<!--/*-------------------------------------------------
HEADER CLASSES
-------------------------------------------------*/-->
.header-wrap{ background:#083266; height:162px;}
.header{ width:1860px; margin:0 auto;}
.logo{ float:left; background:#1491c1; width:300px; float:left;}
.logo h1{font-size:52px; text-align:center; padding:52px 0px 50px 0px;}
.menu{ float:left;}
.menu ul li{ list-style:none; float:left; border-right:#093e76 solid 1px; padding:115px 20px 30px 20px;}
.menu ul li a{ text-decoration:none; color:#80d2f8; font-size:14px; text-align:center;}
.menu ul li a:hover{ color:#1491c1;}
.menu ul li a.active{ color:#1491c1;}
<!--/*-------------------------------------------------
LEFTCOL CLASSES
-------------------------------------------------*/-->
.leftcol{ float:left; width:300px; overflow:hidden;}
.leftcol .title{ margin-bottom:25px;}
.leftcol .content ul li{ list-style:none; border-bottom:#0c4680 solid 1px; line-height:40px;}
.leftcol .content ul li a{ text-decoration:none; color:#1491c1;}
.leftcol .content ul li a:hover{color:#80d2f8;}
.leftcol .panel img{ float:left; border:#fff solid 4px; margin:9px 20px 0px 0px;}
.leftcol .panel .content{ color:#1491c1; overflow:hidden;}
.leftcol .panel .content .button a{ width:53px; height:24px; line-height:24px; float:left; margin:15px 0px 20px 0px;}
.block2 .panel{border-bottom:#0c4680 solid 1px; margin-bottom:18px;}
<!--/*-------------------------------------------------
RIGHT CLASSES
-------------------------------------------------*/-->
.rightcol{ float:left; width:660px; overflow:hidden;}
.rightcol .title{ margin-bottom:25px;}
.rightcol .button{ margin-top:0px;}
.rightcol img{ float:left; margin-right:40px;}
.rightcol .content p{ padding-bottom:30px;}
.button2 a{text-decoration:none; display:block; width:70px; height:30px;
background:#1491c1; color:#ffffff; font-family:Arial, Helvetica, sans-serif; line-height:30px; text-align:center; float:left;}
.button2 a:hover{ background:#0e5295;}
<!--/*-------------------------------------------------
BOX CLASSES
-------------------------------------------------*/-->
.box{ width:230px; background:#083266; padding:20px 20px 35px 20px; float:left;}
.box img{ margin-bottom:25px;}
.box .title{margin-bottom:20px;}
.box .title h1{ font-size:20px; font-weight:normal;}
<!--/*-------------------------------------------------
CONTACT FORM CLASSS
-------------------------------------------------*/-->
.contact-form { background:#0d3d78; padding:30px; width:440px; float:left;}
.contact-form label {display: block; padding:10px 0 10px 0;}
.contact-form label span {display: block; color:#fff;font-size:14px; float:left; width:80px; text-align:left; padding:5px 20px 0 0; font-family: 'Droid Serif', serif;}
.contact-form .input_text {padding:10px 10px;width:318px;background:#07366b; border:none; color:#fff; outline:none;}
.contact-form .message{padding:10px 10px;width:318px; background:#07366b; border:none; overflow:hidden;height:150px; color:#fff; font-size:14px; outline:none;}
.contact-form .button{padding:8px;background:#1491c1; color:#ffffff; text-transform:uppercase; font-family:'Oswald', sans-serif;border:0px solid;margin-left:100px;margin-top:20px;}
.address { float:left; width:250px; margin-left:30px; margin-top:50px;}
.address .panel { border:none; color:#fff;}
.address .panel .title h1 { color:#1491c1; padding-bottom:10px;}
.address .panel .content p span { color:#fff;}
.address .panel .content p .number{ font-size:15px;}
<!--/*-------------------------------------------------
FOOTER CLASSES
-------------------------------------------------*/-->
.footer-wrap{ background:#1491c1; overflow:hidden;}
.footer{ width:960px; margin:0 auto; padding:40px 0px 50px 0px; overflow:hidden;}
.footer .bolg{ width:598px; float:left;}
.footer .panel{ float:left; width:230px;}
.footer .title{ border-bottom:#107eb4 solid 1px; padding-bottom:20px; margin-bottom:30px;}
.footer .title h1{ font-size:20px;}
.footer .panel .content ul li{ float:left; list-style:none; color:#062c5b; font-weight:bold;}
.footer .panel .content p{ color:#fff; font-size:12px; line-height:inherit; padding-top:20px; clear:both;}
.footer .panel .content p a{color:#062c5b; text-decoration:none;}
.footer .panel .content p a:hover{ color:#fff;}
.footer .panel .content p span{ color:#062c5b; font-weight:bold; font-size:12px;}
.footer .quickcontact{ width:270px; float:right;}
我的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>EMS WebGIS Help Center: Home</title>
<link href="http://fonts.googleapis.com/css?family=Droid+Serif" rel="stylesheet" type="text/css">
<link href="Styles.html" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="header-wrap">
<div class="header">
<div class="logo"><h1>Help Center</h1></div>
<div class="menu">
<ul>
<li><a href="index.html" >Home</a></li>
<li><a href="default_controls.html">Default & Controls</a></li>
<li><a href="webmaps_toc.html">Table of Contents</a></li>
<li><a href="identify.html">Identify</a></li>
<li><a href="draw.html">Draw</a></li>
<li><a href="measure.html">Measure</a></li>
<li><a href="add_file.html">Add File to Map</a></li>
<li><a href="print.html">Print</a></li>
<li><a href="bookmarks.html">Bookmarks</a></li>
<li><a href="overview_basemaps.html">Overview & Basemaps</a></li>
<li><a href="users_login.html">Users & Login</a></li>
<li><a href="app_launcher.html">App Launcher</a></li>
</ul>
</div>
</div>
</div><!---header-wrap--->
<div class="wrap">
<div class="leftcol">
<!-- <div class="block">
<div class="panel">
<div class="title">
<h1></h1>
</div>
<div class="content">
<ul>
<li><a href="#">Sed do eiusmod tempor incididunt ut </a></li>
<li><a href="#">Praesent sit amet purus ac ligula tem </a></li>
<li><a href="#">Nam convallis mauris id eros condiment</a></li>
<li><a href="#">Donec a sem sit amet neque iaculis p</a></li>
<li><a href="#">Duis sit amet augue ut urna auctor rut</a></li>
<li><a href="#">Ut fringilla scelerisque enim, nec he</a></li>
<li class="bor-bottm-non"><a href="#">Donec vitae magna in turpis congue</a></li>
</ul>
</div>
</div>
</div> -->
<div class="block2">
<div class="panel">
<img src="images/Calleguas-logo-80px.png" alt="image" />
<div class="content">
<p>Go to the WebGIS program</p>
<div class="button"><a href="http://cloud.emswebmap.com/webgis/src/index.html?agency=callegaus#/homemap">Go</a></div>
</div>
</div>
</div>
<div class="block2">
<div class="panel">
<img src="images/EMSLogoo.gif" alt="image" />
<div class="content">
<p>Visit the EMS Website</p>
<div class="button"><a href="http://www.emsol.com/emsol/index.shtml">Go</a></div>
</div>
</div>
</div>
</div><!---leftcol--->
<div class="rightcol">
<!--<div class="banner"><img src="images/bannerInsert.png" alt="banner" /></div> -->
<div class="page">
<div class="panel mar-bottom">
<div class="title">
<h1></h1>
<h2></h2>
</div>
<div class="content">
<p> <h2>Welcome to the Help Center for the EMS WebGIS program for the Calleguas Municipal Water District. </h2> <br>
<h4>This Help Center provides walkthroughs and information to help users find their way in and out of the WebGIS program.
This page provides the basics to navigation along the map, identification of objects, and much more.
With the help of the EMS WebGIS Help Center, you can become comfortable with the program and its resources.</h4>
<p> <h4>The EMS WebGIS Help Center provides assistance in the following subjects of the program:</h4>
</div>
</div>
<!--Index boxes-->
<div class="box mar-Right">
<div class="panel">
<img src="images/mouse.png" alt="image" />
<div class="title">
<h1>Default & Controls</h1>
</div>
<div class="content">
<p>Familiarize yourself with the program's basics in the map's layout and location of tools, zoom, pan, setting to default and other controls.</p>
<div class="button" align="center"><a href="default_controls.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box">
<div class="panel">
<img src="images/table_of_contents.png" alt="image" />
<div class="title">
<h1>Table of Contents</h1>
</div>
<div class="content">
<p>Learn to access the map's sliders that change appearances in bases and water lines along with toggling items' appearance on the map.</p>
<div class="button" align="center"><a href="webmaps_toc.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box mar-Right">
<div class="panel">
<img src="images/identify.png" alt="image" />
<div class="title">
<h1>Identify</h1>
</div>
<div class="content">
<p>Master selection, identification, and access of specific information.</p>
<div class="button" align="center"><a href="identify.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box">
<div class="panel">
<img src="images/draw.png" alt="image" />
<div class="title">
<h1>Draw</h1>
</div>
<div class="content">
<p>Discover addition of graphics such as lines, circles, rectangles, and text.</p>
<div class="button" align="center"><a href="draw.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box mar-Right">
<div class="panel">
<img src="images/measure.png" alt="image" />
<div class="title">
<h1>Measure</h1>
</div>
<div class="content">
<p>Learn the controls to ascerain length, area, perimeter and more of any selected polygon, line, or circle.</p>
<div class="button" align="center"><a href="measure.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box">
<div class="panel">
<img src="images/add_file.png" alt="image" />
<div class="title">
<h1>Add File to Map</h1>
</div>
<div class="content">
<p>Become an expert at knowing which files to add to the map and browsing your computer for a file to be added to the map.</p>
<div class="button" align="center"><a href="add_file.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box mar-Right">
<div class="panel">
<img src="images/print.png" alt="image" />
<div class="title">
<h1>Print</h1>
</div>
<div class="content">
<p>Learn customization of a capture of the map, saving the page as a pdf, and printing it. </p>
<div class="button" align="center"><a href="print.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box">
<div class="panel">
<img src="images/bookmarks.png" alt="image" />
<div class="title">
<h1>Bookmarks</h1>
</div>
<div class="content">
<p>Figure out how to create, edit, and delete custom presets of specific areas of the map.</p>
<div class="button" align="center"><a href="bookmarks.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box mar-Right">
<div class="panel">
<img src="images/overview_basemaps.png" alt="image" />
<div class="title">
<h1>Overview & Basemaps</h1>
</div>
<div class="content">
<p>Discover the overview window and learn to toggle it, and customize your map to your satisfaction using basemaps.</p>
<div class="button" align="center"><a href="overview_basemaps.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box">
<div class="panel">
<img src="images/users_login.png" alt="image" />
<div class="title">
<h1>Users & Login</h1>
</div>
<div class="content">
<p>Create an account or log in, customize your account, and configure account user settings.</p>
<div class="button" align="center"><a href="users_login.html">Go</a></div> <p />
</div>
</div>
</div>
<div class="box mar-Right">
<div class="panel">
<img src="images/app_launcher.png" alt="image" />
<div class="title">
<h1>App Launcher</h1>
</div>
<div class="content">
<p>Utilize the potential of the program's applications such as Screen Capture and Spreadsheet.</p>
<div class="button" align="center"><a href="app_launcher.html">Go</a></div> <p />
</div>
</div>
</div>
<!--End index boxes-->
<!-- <div class="clearing"></div> ---Image6 clearing below boxes, commented out---
<div class="panel mar-top">
<img src="images/image6Insert.png" alt="image" />
<div class="content">
<p>Donec eros lectus, elementum quis commodo a, lobortis ut mauris. Duis leo risus, fermentum facilisis auctor tempus, elementum ut enim. Maecenas ornare tincidunt semper. Nulla facilisi. </p>
<p>In tristique tellus vel nisi sagittis id bibe ndum tellus varius auris conva</p>
<div class="button2"><a href="#">More Info</a></div>
</div>
</div>-->
</div> <!---page--->
</div><!---Rightcol--->
</div>
<div class="footer-wrap">
<div class="footer">
</div>
</div><!---footer--->
</body>
</html>
提前致谢。
答案 0 :(得分：1)
在您的HTML索引页面中
<link href="Styles.html" rel="stylesheet" type="text/css" />
应该是
<link href="Styles.css" rel="stylesheet" type="text/css" />