如何隱藏Chrome中HTML5 <details>元素默認顯示的箭頭？

我現在還很早，但我也知道你們是最重要的。如何隱藏Chrome中HTML5 <details>元素默認顯示的箭頭？

<details> 
<summary>What's the HTML5 details element?</summary> 
<p>The details element represents a disclosure widget from which the user can obtain additional information or controls.</p> 
</details>

在撰寫本文時，Chrome瀏覽器測試版12是實際上給的細節元素功能的唯一瀏覽器（點擊彙總切換的細節內容）。因此，要回答以下問題，您可能需要使用該瀏覽器。

您是否知道如何隱藏Chrome中默認顯示的細節元素上的箭頭？

它有點像Webkit中的默認樣式<input type="search" />（請參閱http://css-tricks.com/webkit-html5-search-inputs/）。你可以改變它，但不是那麼明顯。

編輯

嘗試沒有成功以下CSS代碼：

details, 
details summary { 
padding-left:0; 
background-image:none; 
-webkit-appearance:none; 
}

有可能是一個機會，我們需要與像details::-webkit-details-disclosure-widget一些奇怪的僞選擇目標，或目前尚未有辦法改變一切。

此外，我發現這個在the specification：

第一容器預計包含至少一個線，框，該行框預計包含公開插件（通常是三角形），水平定位在元素的左邊填充內的。預計該小部件允許用戶請求顯示或隱藏詳細信息。

來源

2011-06-01 DADU

我沒有計劃回答我自己的問題，但我有解決方案。

來源： http://trac.webkit.org/timeline?from=2011-04-15T16%3A33%3A41-0700&precision=second
更多關於推薦用於本發明小窗口：
http://mail-archive.com/[email protected]/msg26129.html

細節摘要:: - WebKit的細節-標記{ 顯示：無; }

請注意，如果您未提供規範允許的摘要元素，則仍會顯示披露窗口小部件。

來源

2011-06-01 14:23:22 DADU

我看到的唯一問題是，這是行不通的跨瀏覽器，一旦別人開始支持''

– Supuhstar 2013-04-04 00:41:36

當他們這樣做，他們可能會自己加前綴的版本，與當前的方式樣式輸入佔位符很像。 – DADU 2013-04-07 19:10:12

有一個愚蠢的顯示問題涉及愚蠢的三角形和鉻開發工具沒有告訴我這個東西的選擇。謝謝！ – 2016-04-29 23:57:02

我不知道這是否會工作，因爲我現在的電腦將無法運行Chrome和我沒有訪問我正常使用電腦，但嘗試添加這對你的CSS文件：

details > summary:first-of-type { 
    list-style-type: none; 
}

請告訴我，如果它有效，我只在推薦中看到它，而不是官方規格。

來源

2011-06-01 02:25:06

謝謝！但這不適用於Chrome。 – DADU 2011-06-01 14:24:09

這適用於Firefox的，但支持Chrome瀏覽器中同樣也需要：http://stackoverflow.com/a/6202729/1293492這2個答案應該合併。 – 2016-10-26 10:00:24

-1

摘要:: - WebKit的細節，標記{ font-size:0px }

✔

來源

2013-03-01 17:01:12 user2121943

使用顯示：無。 – 2014-03-10 21:07:26

我覺得這個作品不夠好。

:: - WebKit的細節-標記{顯示：無; }

來源

2015-07-29 15:45:10 Crystal

如何隱藏Chrome中HTML5 <details>元素默認顯示的箭頭？

回答

相關問題