欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

不完全懸停

CSS

<!DOCTYPE html>
<html>
<head>
  <style>
    ul {
      background-color: tomato;
    }
    
    li {
      display: inline-block;
      height: 20px;
      width: 50px;
      margin: 10px;
    }
    
    a {
      color: white;
    }
    
    li:hover {
      cursor: pointer;
      background-color: teal;
    }
  </style>

  <body>
    <ul>
      <li><a href="#home">Home</a></li>
      <li><a href="#news">News</a></li>
      <li><a href="#news">About</a></li>
    </ul>
  </body>
</html>

懸停狀態(tài)下的藍(lán)綠色覆蓋了整個(gè)& lt李& gt元素符合預(yù)期。但是該元素有余量。邊距在元素周圍而不是元素內(nèi)部創(chuàng)建空間。它周圍的空間不會(huì)因?yàn)閼彝ＰЧ淖冾伾?/p>

您可以替換& lt李& gt使用填充來(lái)增加元素內(nèi)的空間:

<!DOCTYPE html>
<html>
<head>
  <style>
    ul {
      background-color: tomato;
    }
    
    li {
      display: inline-block;
      height: 20px;
      width: 50px;
      padding: 10px; /* <--- here */
    }
    
    a {
      color: white;
    }
    
    li:hover {
      cursor: pointer;
      background-color: teal;
    }
  </style>

  <body>
    <ul>
      <li><a href="#home">Home</a></li>
      <li><a href="#news">News</a></li>
      <li><a href="#news">About</a></li>
    </ul>
  </body>
</html>

發(fā)生不完全懸停是因?yàn)樵氐谋尘俺叽? quotul & quot比你的& quot李說(shuō):元素。每當(dāng)我們制作這種類型的列表時(shí)，我們首先創(chuàng)建一個(gè)& quotul & quot元素，然后用& quot李說(shuō):元素，所以它是& quotul & quot。您需要提到兩個(gè)元素的大小，并保持li的大小小于ul元素的大小。

希望這回答了你的問(wèn)題。