StaticMenuItemStyle與StaticSelectedStyle - 是否覆蓋另一個？

我正在ASP.NET中使用C＃代碼構建一個自定義asp：菜單控件。它基於我的網站的站點地圖。這是菜單的基礎：StaticMenuItemStyle與StaticSelectedStyle - 是否覆蓋另一個？

<%@ Control language="C#" autoeventwireup="true" codefile="Control.ascs.cs" inherits="menuClass" %> 
<asp:menu id="myMenu" datasourceid="sitemap" runat="server"> 
    <staticmenuitemstyle font-underline="true" /> 
    <staticselectedstyle font-bold="true" font-underline="false" /> 
</asp:menu>

這應該是很明顯的，我想點擊的菜單項大膽，而不是下劃線，必須強調所有其他項目。問題是每個項目都有下劃線，儘管所選項目變得粗體。

一個有趣的測試是交換兩個下劃線布爾值。結果是所選項目確實加下劃線，而所有其他項目未加下劃線。這是預期的結果，但考慮到我面臨的問題時會感到困惑。

我試圖使用cssclass屬性來解決這個問題，但無濟於事。謝謝。

來源

2009-11-04 TahoeWolverine

有人可以簡單地試圖重現這至少？ – TahoeWolverine 2009-11-09 21:54:05

訣竅是使用CssClass，並將CSS僅應用於超鏈接（「a」elenent），而不應用於ASP.NET用來顯示菜單項的周圍HTML表。下面是說明你正在尋找的行爲的自包含的代碼示例：

<%@ Page Language="C#"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
    <style type="text/css"> 
    .notSelected a 
    { 
     text-decoration:underline; 
    } 
    .selected a 
    { 
     font-weight:bold; 
     text-decoration:none; 
    } 
    </style> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:menu id="myMenu" runat="server"> 
      <StaticMenuItemStyle CssClass="notSelected" /> 
      <StaticSelectedStyle CssClass="selected" /> 
      <Items> 
       <asp:MenuItem Text="Test (selected)" Selected="true" NavigateUrl="~/Default.aspx"></asp:MenuItem> 
       <asp:MenuItem Text="Test (not selected)" NavigateUrl="~/Default.aspx"></asp:MenuItem> 
      </Items> 
     </asp:menu> 
    </div> 
    </form> 
</body> 
</html>

這個問題的根本原因似乎是瀏覽器如何處理應用到相同的不同的CSS類中定義多個衝突文本的裝修風格一個元素，也許還有瀏覽器如何處理父類的繼承，這些父元素也應用了相同的樣式。（ASP.NET的菜單控件在底層使用CSS類來定義「內聯」樣式，比如font-underline「attribute」，並且它們也在父元素上應用了A元素上的相同樣式。查看源代碼HTML由我上面的示例或通過您的代碼發出，以更好地瞭解它的工作方式。）

我偶然偶然發現了嵌套的CSS技巧，因爲我試圖縮小問題的原因。似乎如果您只將CSS應用於A元素，則組合效果會更好。您可以通過實驗推斷出生成的HTML中的View Source以及選擇性地改變應用於每個元素的CSS類樣式的基本規則。

你也可以嘗試破解CSS規範，瞭解繼承和衝突如何與CSS類一起工作，但我懷疑實驗會更容易。 :-)

來源

2009-11-13 16:43:31

我喜歡你的答案，尤其是因爲它是一個簡單的解決方案，但我不明白這與列出樣式屬性內嵌式有什麼不同。你能解釋一下這裏的區別嗎？ – TahoeWolverine 2009-11-16 15:33:17

我編輯了一些更詳細的答案 - 我不清楚它爲什麼有效，但希望我指出你在正確的方向來確定管理此行爲的基本規則。 – 2009-11-16 19:44:01

StaticMenuItemStyle與StaticSelectedStyle - 是否覆蓋另一個？

回答

相關問題