我的CSS被称为ppcss.css,但在我拥有3个jquery链接之后,它覆盖了我的CSS并使我的页面看起来不同。任何人都可以帮我解决这个问题吗?修改或更改解释我的代码。谢谢。为什么我的CSS被覆盖?
$(function() {
$("#tabs").tabs();
});
body { background-color:#00BFFF;}
\t \t
div#header { width:auto;
\t \t \t height:75px;
\t \t \t background-image:url('banner.gif');
\t \t } \t
h1{ color:white;
\t \t \t text-align:center;
\t \t \t font-size:1.8em;
\t \t \t
\t \t \t }
h3{ color:white;
\t text-align:center;
\t font-size:1em;
\t \t \t
\t \t \t }
div#wrapper{width:1200px;
\t \t \t background-color:#fff;
\t \t \t margin-left:auto;
\t \t \t margin-right:auto;
\t \t \t
\t \t \t
\t \t \t } \t
\t \t
h1.head,h3.subhead{font-family:georgia,serif;
\t \t \t \t \t margin-left;20px;}
\t \t \t \t \t \t
\t \t \t \t
\t \t \t \t \t \t
h1.head{font-size;2.25em;
\t \t padding-top:15px;
\t \t
\t }
h3.subhead{ margin-top:-20px;
\t \t \t letter-spacing:1px;
\t \t }
ul#navlist li{ display:inline;
\t \t \t list-style-type:none;
\t \t \t padding-right:30px;}
ul#navlist{ \t \t \t
\t \t \t background-color:#ADFF2F;
\t \t \t margin-top:.99px;
\t \t \t margin-bottom:1.99px;
\t \t }
ul#navlist a{ \t \t \t
\t \t \t text-decoration:none;
\t \t \t font-size:1.5em;
\t \t } \t \t
ul#navlist a:hover{ \t color:red; \t \t
\t \t \t
\t \t } \t
\t
div#leftcol{ float:left;
\t \t \t width:180px;
\t \t \t margin-left:2px;}
div#maincol{float:left;
\t \t width:500px;
\t \t \t margin-left:15px;
\t \t \t margin-right:15px;
\t \t \t text-align:center;
\t \t \t }
div#maincol h5{font-size:85%;
\t \t \t line-height:1.25em;
\t \t \t text-align:center;
\t \t \t margin-right:1px;
\t \t \t font-family:arial, sans-serif;
\t \t \t }
\t \t \t
div#rightcol{ width:180px;
\t \t \t \t float:right;
\t \t \t \t margin-right:20epx;
\t \t \t \t
\t \t \t \t }
div#footer{ background-color:#ADFF2F;
\t \t \t \t \t height:15px;
\t \t \t \t \t clear:both;}
#home div.smfeature{width:180px;
\t \t \t height:auto;
\t \t \t border:thin solid red;
\t \t \t margin-bottom:10px;}
#home div.smfeature h4 { font-family:arial,sans-serif;
\t \t \t \t font-size:75%;
\t \t \t \t color:brown;
\t \t \t \t background:#48D1CC;
\t \t \t \t text-align:center;
\t \t \t \t letter-spacing:2px;
\t \t \t \t padding:.5em;
\t \t \t \t
\t \t \t \t margin-top:0px;
\t \t \t \t margin-right:0px;
\t \t \t \t }
div#searchbox2 { background-color:#7B68EE;
\t \t \t \t \t text-align:center;
\t \t \t \t \t }
div#links { width:150px;
\t \t \t height:auto;
\t \t \t text-align:center;
\t \t \t }
a { text-decoration: none;
\t } \t \t \t \t
p a:hover{ color:red;}
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<div id="tabs">
<ul>
<li><a href="#home">Homepage</a></li>
<li><a href="animals.html">Animals</a></li>
<li><a href="Algae.html">Plants</a></li>
<li><a href="FAQS.html">F.A.Qs</a></li>
\t
\t <li><a href="ContactUs.html">Contact us</a></li>
</ul>
<div id="home">
\t <div id="wrapper">
\t <!-- header -->
\t <div id="header">
\t <h1 class="head"> Underwater World </h1>
\t <h3 class="subhead">
\t A New World!
\t </h3>
\t </div>
\t
\t \t
\t <!-- left column -->
\t <div id="leftcol" >
\t
\t <div class="smfeature">
\t <h4> Who we are. </h4>
\t
\t </div>
\t
\t <div class="smfeature">
尝试添加小提琴,这将鼓励人们来回答你的问题。 – 2014-12-08 04:12:06
@PrashantKumar如何添加小提琴? – 2014-12-08 04:14:07
使用此链接http://jsfiddle.net/并添加您的代码.. – vijaykumar 2014-12-08 04:17:45