我无法解决此问题。我不知道如何摆脱导航背后的黑色。在我看来，当我审查每个元素时，所有的css样式都不是黑色的。
干杯。
以下是我的问题的截图。
https://drive.google.com/file/d/0B7T0xtNhpIRZYjc5VHlNVlVTdTg/view?usp=sharing
这是PHP / HTML
<head>
<link type="text/css" rel="stylesheet" href="Car_Style.css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<link rel="stylesheet" id="font-awesome-css" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" type="text/css" media="screen">
</head>
<body>
<header id="header" class="loading";]>
<!-- Logo -->
<div id="logo">
</div>
<!-- Nav -->
<nav id="nav">
<img src="http://1673-itstudies/12-infotech/jsummers/About%20Us//About%20US/Images/LOGO_copy.png" id="logo">
<ul id="links4nav">
<li><a href="http://1673-itstudies/12-infotech/jsummers/New_Car_Form/New_Car_Form.html">New Vehicle</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">About</a></li>
</ul>
<a href="http://1673-itstudies/12-infotech/jsummers/Carsales_Network.php">
<h4 id="navtitle">AUTO NETWORK | THE LEAD SALE</h4>
</a>
</nav>
</header>
<div id=scroller>
<a href="#" class="back-to-top" style="display: inline;">
<i class="fa fa-arrow-circle-up"></i>
</a>
<script id="scroller">
jQuery(document).ready(function() {
var offset = 250;
var duration = 300;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
jQuery('.back-to-top').fadeIn(duration);
} else {
jQuery('.back-to-top').fadeOut(duration);
}
});
jQuery('.back-to-top').click(function(event) {
event.preventDefault();
jQuery('html, body').animate({scrollTop: 0}, duration);
return false;
})
});
</script>
<script id ="fading-scroller">
$(window).scroll(function() {
var pxFromBottom = 350;
if ($(window).scrollTop() + $(window).height() > $(document).height() - pxFromBottom) {
$('.scroll-btn').fadeOut('slow');
} else {
$('.scroll-btn').fadeIn('slow')
}
});
</script>
</div>
</body>
<?php
try {
# Connect to SQLite database
$dbh = new PDO("sqlite:Car_Sales_Network");
# Prepare SQL statement
$sth = $dbh->prepare('SELECT * FROM Cars_On_Network' );
# Set the Fetch Mode to Associative Array
$sth->setFetchMode(PDO::FETCH_ASSOC);
# Run the query on the database
$sth->execute();
//table printout
echo "<table>";
# Loop through returned records
while($row = $sth->fetch()) {
//print_r($row);spot
//print_r($row);
# If the image field is empty, change to dummy image
if (empty($row['car_image_url'])) {
$row['car_image_url'] = 'http://1673-itstudies/12-infotech/jsummers/Cars_Photos/placeholder.png';
}
// added these line */
echo "<table>";
/* added this line */
/* // added this line */
echo "<th>Car Make:</th>";
echo "<th>Car Model:</th>";
echo "<th>Car Badge:</th>";
echo "<th>Car Price:</th>";
echo "<th>Car Transmission:</th>";
echo "<th>P Plate Legality:</th>";
echo "<th id='car'>Car Image:</th>";
echo "<div id='1'>";
echo "<tr>";
echo "<td>". $row["car_make"] . "</td>";
echo "<td>". $row["car_model"] . "</td>";
echo "<td>". $row["car_badge"] . "</td>";
echo "<td>". $row["price"] . "</td>";
echo "<td>". $row["trans"] . "</td>";
echo "<td>". $row["P_Plate_Legal"] . "</td>";
echo "<td id='img'><img src=\"". $row["car_image_url"] . "\" /></td>";
/* // this allows the image link to be converted from a link to an image */
echo "</tr>";
echo "</div>";
//echo $row["Game_ID"];
echo "<br>";
}
echo "</table>";
}
catch(PDOException $e) {
echo $e->getMessage();
}
?>
这是CSS：
* {
font-family: Arial;
color: white;
transition: 1s;
background-image: url(http://1673-itstudies/12-infotech/jsummers/Cars_Photos/background.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
-webkit-text-stroke: 0.1px #333333;
}
#links4nav {
list-style-type: none;
margin: 0;
padding: 0;
font-family: Arial;
background-color: rgba(255, 255, 255, 0.9); /* Color white with alpha 0.9*/
background-color: orange;
transition: 1s;
}
#navi {
background: #ff0015;
background-color: #ff0015;
font-family: Arial;
display: inline-block;
}
table {
padding: 20px;
border: 2px;
outline: none;
background-image: none;
color: white;
}
th td {
padding-right: 20px;
padding-left: 20px;
margin-right: 5em;
}
/*********************************************************************************/
/* Header */
/*********************************************************************************/
#header {
position: fixed;
z-index: 10000;
left: 0;
top: 0;
width: 100%;
background: #ff0015;
height: 3em;
line-height: 3em;
transition: none;
padding-top: 8px;
}
body {
padding-top: 3em;
}
#logo {
position: absolute;
left: 1em;
top: 2px;
height: 3em;
line-height: 3em;
letter-spacing: -1px;
}
#logo a {
font-size: 1.25em;
}
#nav {
position: fixed;
right: 0.5em;
top: 0;
height: 3em;
line-height: 3em;
color: #ff0015;
opacity: 30;
}
#nav ul {
margin: 0;
}
#nav ul li {
display: inline-block;
margin-left: 0.5em;
font-size: 0.9em;
}
#nav ul li a {
display: block;
color: #ff0015;
text-decoration: none;
height: 3em;
line-height: 3em;
padding: 0 0.5em 0 0.5em;
outline: 0;
background-color: #ff0015;
}
/*
td{
width: 336px;
height: 223px;
}
*/
#img {
opacity: 100;
border: solid black 2px;
}
#logo {
width: 212px;
height: 48px;
position: fixed;
float: left;
}
#navtitle {
font-family: Arial;
color: white;
position: fixed;
left: 230px;
background: #ff0015;
top: -22px;
}
ul #nav #navbar{
color: #ff0015;
background-color: #ff0015;
}
#car{
width: 50px;
height: 50px;
}
}
.back-to-top {
background: none;
margin: 0;
position: fixed;
bottom: 0;
right: 1000;
width: 70px;
height: 70px;
z-index: 100;
display: none;
text-decoration: none;
color: #ffffff;
transition: 0.5s;
}
.back-to-top i {
font-size: 60px;
position: fixed;
transition: 0.5s;
}
#scroller {
background: none;
transition: 0.5s;
}
答案 0 :(得分：1)
#nav ul li {
display: inline-block;
margin-left: 0.5em;
font-size: 0.9em;
background:inherit; //Inherits its property from its parent element which in your case can be the solution
}
答案 1 :(得分：0)
试试这个
#nav ul li {
display: inline-block;
margin-left: 0.5em;
font-size: 0.9em;
background:none; //added new line.
}
更新1：
#links4nav {
list-style-type: none;
margin: 0;
padding: 0;
font-family: Arial;
transition: 1s;
}
#nav ul li a {
display: block;
color: #fffff;
text-decoration: none;
height: 3em;
line-height: 3em;
padding: 0 0.5em 0 0.5em;
outline: 0;
}
你有很多重复的CSS。避免那些。避免不必要的id插入。将style.css映射到css以进行更改。
答案 2 :(得分：0)
试试这个
#nav ul li, #nav ul { background:none;}
我把你的代码变成了一个小提琴，但是我无法看到这个问题，所以让我们尝试一下。