重寫這段代碼：點擊的div

我想改變這種：重寫這段代碼：點擊的div

<a href='foo'> 
    <div> Moo </div> 
</a>

是符合標準的（你不應該有內聯元素塊元素）。將javascript配置爲僅用於導航的div看起來像是黑客並降低了可訪問性。在這種情況下，我的要求是針對固定維度鏈接上的2組邊界，因此上述不符合規範的代碼在應用樣式之後完美工作。

此外，是「a { display:block; }」合法的方式來規避驗證？

來源

2008-11-10 Jimmy

爲什麼不使用<跨度>而非<DIV>並設置顯示：塊兩個要素是什麼？

此外，回答你的後一個問題：我不相信加入display：block;到你的錨會讓它通過驗證。驗證程序將檢查您是否遵循（X）HTML規則，而不是如何將頁面呈現給用戶。

來源

2008-11-10 16:12:11

由於html和css驗證是兩個獨立的動物，因此您是正確的先生。 – 2008-11-10 17:32:36

我不得不爲表單按鈕做類似的事情。這種策略對於表單元素來說效率不高，但它仍然有效，並且我們得到了雙刃的邊界。這是一個無趣的邊框風格：雙重財產如此糟糕地實施跨瀏覽器... – 2008-11-10 18:58:50

我通常認爲<a >標籤是此目的的特例。你應該可以將它應用到任何事情上 - 它是超類文本的全部點之後（<tr >想到一個很好的例子）。但如果你必須通過一個驗證器，我明白了。

你可以使用javascript的onclick處理程序的div，並完全消除錨？

來源

2008-11-10 16:16:37

如果僅用於顯示目的，您可能需要考慮將div放在a之外，除非重要的是可以點擊外邊框。無論是這樣的：

<div class="dbl_border_links"><a href="blah">Blah text</a></div>

或本：

<a class="dbl_border_links" href="blah"><span>Blah text</span></a>

會工作，你可以使用這樣的事情：

<style> 
    .dbl_border_links, .dbl_border_links>* { 
    display: block; 
    border: 1px solid; 
    padding: 1px; 
    } 
    .dbl_border_links { 
    border-color: red; 
    } 
    .dbl_border_links > * { 
    border-color: blue; 
    } 
</style>

指定的樣式。就我個人而言，我會去與div包含a，但任一方法的作品。

來源

2008-11-10 17:27:49

是啊，div的背景需要點擊。 – Jimmy 2008-11-10 17:29:14

首先，給出錨點顯示肯定沒有錯：block;我認爲這是人們用CSS做的更常見的事情之一，並且完全符合標準。其次，有很多方法可以在HTML元素上實現雙邊框。首先，檢查出「綱要」屬性：

http://webdesign.about.com/od/advancedcss/a/outline_style.htm

誠然，這隻會在更現代的瀏覽器中運行，但應適度降低爲綱不佔用網頁中的任何空間。如果鏈接的內容是圖像，您可以簡單地給<一個填充和一個背景色以及一個正常邊框（以另一種顏色）來創建雙邊框的印象。或者給圖片一個自己的邊框。當然，你也可以按照你最初的想法做一些事情，儘管你可以用另一種方式嵌套你的HTML，並簡單地爲每個元素分配一個不同的邊界。或者你可以在鏈接中使用一個內聯元素（如<範圍>或<em>或其他），你也可以設置顯示：block; （是的，這也是有效的！）。快樂的編碼！

來源

2008-11-11 01:44:54

如果我正確理解了你的意圖，你應該像前面提到的那樣，將錨點之外的div放置在錨點之外，並且爲了獲得相同的表示，請將錨點設置爲width:100%;height:100%。跨瀏覽器milage可能會有所不同。另外，你可以徹底轉儲div並給錨點display:block;

你到底想要做什麼？

來源

2008-11-11 02:13:17 voyager

重寫這段代碼：點擊的div

回答

相關問題