如何删除摘要元素侧面的箭头

Question

如何删除摘要元素侧面的箭头

我在详细信息元素中有一个摘要：

<details>
  <summary>Hello</summary>
</details>

Run Code Online (Sandbox Code Playgroud)

我努力了：

summary {
  display: block; /* works in firefox */
  list-style: none; /* works in firefox */
}

/* didn't work in any browser */
summary::marker,
summary::-webkit-details-marker {
  display: none;
}

/* Solution for Chrome and Safari? */

Run Code Online (Sandbox Code Playgroud)

从这个问题如何隐藏 Chrome 中 HTML5 <details> 元素上默认显示的箭头？。

但这些解决方案实际上都不适用于 Chrome。

如何在 chrome 中删除此箭头？

Answer 1

小智 6

这对我有用！

summary::marker {
  content: "";
}

Run Code Online (Sandbox Code Playgroud)

Answer 2

小智 -5

    <!DOCTYPE html>
    <html>

    <head>
        <title>Page Title</title>
        <style>
            summary {
                display: block;
                /* works in firefox */
                list-style: none;
                /* works in firefox */
            }

            summary::after {
                display: block;
                list-style: none;
            }

            summary::-webkit-details-marker {
                display: none;
            }
        </style>
    </head>

    <body>

        <details>
            <summary>Hello</summary>
        </details>

    </body>

    </html>

Run Code Online (Sandbox Code Playgroud)

您似乎已经复制/粘贴了OP说不起作用的问题中的代码。没有解释你改变了什么（如果有的话）或者为什么它应该解决问题。 (2认同)

归档时间：	5 年，11 月前
查看次数：	4635 次
最近记录：	2 年前