如何隐藏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>
在写这篇文章的时候，Chrome12beta版是唯一一个真正赋予details元素功能的浏览器(点击摘要切换细节内容)。因此，要回答以下问题，您可能需要使用该浏览器。
你知道如何隐藏默认情况下显示在细节元素上的箭头吗？
它有点像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中发现了这一点
第一个容器预计将包含至少一个线框，而该线框将包含一个公开窗口小部件(通常为三角形)，该窗口水平放置在details元素的左侧填充中。该小部件将允许用户请求显示或隐藏详细信息。
回答 9
Stack Overflow用户
发布于 2011-06-01 22:23:22
我不打算回答我自己的问题，但我有解决方案。
关于公开小部件的推荐：http://trac.webkit.org/timeline?from=2011-04-15T16%3A33%3A41-0700&precision=second
- More
- 来源：
http://mail-archive.com/whatwg@lists.whatwg.org/msg26129.html
代码
details summary::-webkit-details-marker {
display:none;
}请注意，如果您不提供规范允许的摘要元素，则仍然会显示披露小部件。
Stack Overflow用户
发布于 2019-06-18 20:58:44
根据https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Customizing_the_disclosure_widget的说法
您可以通过以下方式实现这一点：
details > summary {
list-style: none;
}
details > summary::-webkit-details-marker {
display: none;
}Stack Overflow用户
发布于 2011-06-01 10:25:06
我不确定这是否有效，因为我现在的电脑不能运行Chrome，而且我也不能访问我通常使用的电脑，但是试着把这个添加到你的css文件中：
details > summary:first-of-type {
list-style-type: none;
}一定要告诉我它是否有效，我只是在推荐中看到了它，而不是官方规范。
https://stackoverflow.com/questions/6195329
复制相似问题