這是我的第一篇文章。當我懸停在導航欄中時,我遇到背景顏色問題。它在Mozilla中運行良好,但由於某種原因,在Chrome瀏覽器中,只有部分菜單項在懸停時發生變化。任何幫助將不勝感激。導航鏈接背景懸停在谷歌瀏覽器中不起作用
<?php
$link = mysql_connect ("localhost", "pouredin_web", "Asdfgh.12345") or die ('I cannot connect to the database.');
mysql_select_db("pouredin_web", $link);
//$Sql = "select * from news where status = 1 and web_id = ".$web_id." and pdate_in < NOW() and pdate_out > NOW() and ntype = 'Evento' order by nlevel, pdate_in desc limit 0,3 ";
$Sql = "select * from contents";
$data = array();
$result = mysql_query($Sql,$link);
while($row = mysql_fetch_array($result))
{
$data[$row["name"]] = $row["ntext"];
//echo $row["name"].'<br>';
}
mysql_free_result($result);
?>
<!DOCTYPE HTML>
<!--
Landed by HTML5 UP
html5up.net | @ajlkn
-->
<html>
<head>
<title>EPDM Polmers | EPDM Rubber Granules | Poured-In-Place Rubber</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="./css/main.css" />
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
<!-- Start WOWSlider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="./css/style.css" />
<script type="text/javascript" src="./js/jquery.js"></script>
<!-- End WOWSlider.com HEAD section -->
<link rel="stylesheet" href="./js/BackToTop.jquery.css" type="text/css" />
</head>
<body>
<div id="page-wrapper">
<!-- Header -->
<div class="keywords"><?php echo $data["topText"] ?></div><!--end keywords-->
<header id="header">
<div class="container">
<div id="logo"><a href="index.php"><img src="images/epdm-logo.png" class="image-full" ></a></div>
<div id="chris"><a href="index.php"><img src="images/ISO9001.jpg" class="image-full" ></a></div>
<nav id="nav">
<ul>
<li><a href="index.php"><span>HOME</span></a><li>
<li><a href="aboutus.php"><span>OUR COMPANY</span></a></li>
<li><a href="products.php"><span>PRODUCTS</span></a>
<ul>
<li><a href="ecolastic-epdm-granules.php"<span>EPDM Rubber Granules</span></a></li>
<li><a href="airethane-polyurethane-products.php">Polyurethane Binder</a></li>
</ul>
<li><a href="ecolastic-epdm-granules.php"><span>EPDM RUBBER</span></a>
<li><a href="resources.php"><span>DATA SHEETS</span></a></li>
</ul>
</nav>
<div class="clear"></div>
</div><!--end container-->
</header>
CSS FILE
/* Header */
#page-wrapper {
padding-top: 0em;
}
#header {
}
#header #logo{ display:block; float:left; max-width:100px; margin: 25px auto;
}
#chris { display:block; float:right; max-width:100px; margin: 25px auto;
}
#header nav { margin-top:3.5em; display:block; float:right; background:url(../../images/nav-tail.gif) repeat-x top;
}
#header nav ul {
margin: 0; padding:0;
}
#header nav ul li {
display: block;
float:left;
margin: 0; padding:0;
background:url(../../images/nav-border.gif) right center no-repeat;
}
#header nav ul li:last-child { background:none;}
#header nav ul li a{ padding:0.9em 2.85em;}
#header nav ul li a, #header nav ul li span {
border: 0;
color: inherit;
display: block;
height: inherit;
line-height: inherit;
outline: 0;
}
#header nav ul li.current { color: #FFF;
background: rgb(76,76,76);
background: -moz-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(43,43,43,1) 54%, rgba(19,19,19,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(76,76,76,1)), color-stop(54%,rgba(43,43,43,1)), color-stop(100%,rgba(19,19,19,1)));
background: -webkit-linear-gradient(top, rgba(76,76,76,1) 0%,rgba(43,43,43,1) 54%,rgba(19,19,19,1) 100%);
background: -o-linear-gradient(top, rgba(76,76,76,1) 0%,rgba(43,43,43,1) 54%,rgba(19,19,19,1) 100%);
background: -ms-linear-gradient(top, rgba(76,76,76,1) 0%,rgba(43,43,43,1) 54%,rgba(19,19,19,1) 100%);
background: linear-gradient(to bottom, rgba(76,76,76,1) 0%,rgba(43,43,43,1) 54%,rgba(19,19,19,1) 100%);}
#nav ul li a:hover {background: #333;}
#header nav ul li:hover { background:#333; }
#header nav ul li:hover a{color:#FFF !important;}
#header nav ul li a:not(.button):before, #header nav ul li span:not(.button):before {
margin-right: 0.5em;
}
#header nav ul li.active > a, #header nav ul li.active > span {
color: #fff; background:#333;
}
#header nav ul li > ul {
display: none;
}
工作正常嗎? http://codepen.io/anon/pen/oBQPVx –