国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

重寫後的標(biāo)題為:改變清單標(biāo)題以回應(yīng)遊標(biāo)移動(dòng)到清單元素
P粉131455722
P粉131455722 2023-09-04 23:54:54
0
1
621
<p>我正在建立一個(gè)連結(jié)表格,我希望當(dāng)我將滑鼠移到清單連結(jié)之一時(shí),透過(guò)更改表格標(biāo)題的背景顏色使表格更加漂亮。然而,我不知道如何透過(guò)影響其較小元素來(lái)更改容器元素的屬性。這是我的程式碼:</p> <pre class="brush:php;toolbar:false;"><html lang="vi"> <head> <style> .toc-container { max-width: 600px; font-family: "Roboto", sans-serif; background: #deff9d; border-radius: 8px; box-shadow: 0 4px 11px rgba(0, 0, 0, 0.6); } .toc-container h2.index-heading { text-transform: uppercase; font-weight: normal; margin: 0 16px; padding-top: 16px; } .table-of-contents { list-style: none; padding: 0; } .table-of-contents li.author li.blog { background: #222; transition: 400ms; list-style: none; } .table-of-contents li.author{ background-color: green; } .table-of-contents li.author li:nth-of-type(even).blog { background: #2e2e2e; } .table-of-contents li.author li:hover.blog { background: #000; } .table-of-contents li a { text-decoration: none; color: #fff; margin-left: 24px; padding: 16px 0; display: block; } </style> </head> <body> <div class="toc-container"> <h2 class="index-heading">heading</h2> <ul class="table-of-contents"> <li class="author"> <a href="#">作者的名字</a> <ul> <li class="blog"> <a href="#">Nháp 1</a> </li> </ul> </li> </ul> </div> </body> </html></pre>
P粉131455722
P粉131455722

全部回覆(1)
P粉343408929

我認(rèn)為使用JavaScript更容易實(shí)現(xiàn)這一點(diǎn),你可以使用元素事件 mouseentermouseleave 來(lái)實(shí)現(xiàn)樣式的改變,也許這可以幫助你。下面是程式碼:

  <script>
    const headerDiv = document.querySelector('.index-heading');
    const blogDiv = document.querySelector('.blog');
    blogDiv.addEventListener('mouseenter', function(e) {
      headerDiv.style.background = 'purple'
    })
    blogDiv.addEventListener('mouseleave', function(e) {
      headerDiv.style.background = '#deff9d'
    })
  </script>
最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板