爲什麼不同的HTML ID具有相同的風格？

我有兩個不同ID的表，他們在不同的頁面。單獨來說，它們都很好，但是當我將它們包含在單個頁面中時，雖然HTML元素的ID不同，但樣式重疊。下面是我的代碼：爲什麼不同的HTML ID具有相同的風格？

<head> 

<rel="Stylesheet" href="CSS/styles.css"> 

</head> 

<body> 
<table id="logo" style="width:100%"> 
    <th><img src="Image/vg_logo.png" style="width:150px;height:100px"></th> 
</table> 
</body>

風格上面的代碼：

#logo{ 
border: none; 
}

與其它元素代碼：

$query="select * from users order by id"; 
      $result=mysqli_query($con,$query); 
      echo '<table id="userTable"><tr><th>User ID</th><th>Full Name</th><th>User Name</th><th>User Role</th></tr>'; 

      while ($row=mysqli_fetch_array($result)) 
      { 
       echo '<tr><td>'.$row['id'].'</td><td>'.$row['userFullName'].'</td><td>'.$row['userName'].'</td><td>'.$row['type'].'</td></tr>'; 
      } 
      echo '</table>';

和風格：

#userTable{ 
float:right; 
width: 550px; 
} 
#userTable, th, td{ 
border: 1px solid black; 
border-collapse: collapse; 
font-family:tahoma; 
font-size:14px; 
} 

th{ 
background-color: #a1aec4; 
}

現在問題是每當我包括第一頁pag e與第二個，第一個桌子得到一個邊界。我在哪裏設置border:none，爲什麼會發生這種情況？

來源

2017-02-20 Bappy

您是否仔細檢查了輸出HTML的有效性？這通常是一個開始的好地方。你可能重用了一個ID而沒有意識到它。 – GordonM

更改這條線在你的CSS：

#userTable, th, td{

到

#userTable, #userTable th, #userTable td{

來源

2017-02-20 09:15:33 Mark

因爲你給了一個全球性的風格，所有<th>和td元素使用明確的選擇..它也加入一個th元素的邊框，這就是爲什麼你的#logo表似乎有邊框，因爲你有一個th元素。

來源

2017-02-20 09:18:01

-1

@Mark是正確的。只是爲了便於定義

th{ 
background-color: #a1aec4; 
}

也帶有一個選擇器，否則所有th將得到相同的顏色。

來源

2017-02-20 09:23:18 nitinkaushik19490

請不要使用回答留下評論 – GordonM

爲什麼不同的HTML ID具有相同的風格？

回答

相關問題