CSS - 懸停問題

我想知道如何使用CSS查看主父級子類別時如何保持我的主父級類別突出顯示？CSS - 懸停問題

快速示例或教程將有助於感謝。

來源

2011-07-14 NET

請發表您的代碼，以便能能夠證明這個問題 –

我的html代碼很長，發佈很多neste d列表。 – NET

您至少應該告訴我們您使用什麼樣的工具/框架來生成您的網站，以便我們能夠提供更具體和有用的答案。你只是用記事本編輯HTML文件或什麼？你有多個文件或單個文件在用戶點擊按鈕時發生變化？ –

對此，您可以使用CSS play 1或CSS play 2中的代碼。

每個示例都滿足您的需求。主要想法是使用僞類的基類：

#menu li a:hover {border:0; text-decoration:underline;} 
#menu li:hover dd, #menu li a:hover dd {display:block;} 
#menu li:hover dl, #menu li a:hover dl {padding-bottom:15px;} 
#menu li:hover dt a, #menu li a:hover dt a, #menu dd a:hover {color:#c00;}

來源

2011-07-14 07:18:44 VMAtm

我自己想通了，謝謝你的回答 – NET

你的CSS看起來會有點像這樣：查看你需要添加的子類別時

.highlighted, a:hover { 
    /* styles for when the category is hovered or highlighted */ 
}

那麼「突出」 CSS類來表示父類的元素。你如何做到這一點取決於你的網站如何工作，但它可以用JavaScript或服務器端代碼來完成。

編輯1：是的，這可以用CSS來完成，但它可能需要大量的手工勞動。如果您的網站只是一堆靜態HTML文件，您可以進入並編輯它們中的每一個以突出顯示父級。例如，題目爲「轎車」（汽車的一個子類）的頁面上，你可以改變

<div class="category">Cars</div>

到

<div class="category highlighted">Cars</div>

應該有什麼奇怪的或特別的是你。

來源

2011-07-14 07:01:08

是否可以用css來完成？ – NET

在答案中查看我的編輯1。 –

我想出了自己感謝您的答案。 – NET

http://jsfiddle.net/axCPq/

CSS：

.main-parent:hover a.parent { color: green; } 
.child-ul a:hover { color: green; }

HTML：

<ul class="main-parent"> 
     <li><a class="parent" href="#">Link Parent</a> 
     <ul class="child-ul"> 
      <li><a href="#">Link Child</a></li> 
      <li><a href="#">Link Child</a></li> 
      <li><a href="#">Link Child</a></li> 
      <li><a href="#">Link Child</a></li> 
      <li><a href="#">Link Child</a></li> 
      <li><a href="#">Link Child</a></li> 
     </ul> 
     </li> 
    </ul>

來源

2011-07-14 07:22:11 Joonas

CSS - 懸停問題

回答

相關問題