覆蓋 li 元素的用戶代理樣式

Question

我有以下 html。

   <div class="alert alert-error" role="alert">        
        <ul>
            <li>This is test message.</li>
        </ul>
    </div>

我正在使用引導警報。 警報 styles 在自定義 css 中被覆蓋，以在警報消息之前添加ban-circle 。

.alert {
    padding: 5px;
    margin-bottom: 5px;
    color: white;
}   

.alert-error {
    background-color: rgb(186, 39, 39);
}

    /*Using a Bootstrap glyphicon as ban-circle*/
    .alert-error li:before {
        content: "\e090"; 
        font-family: 'Glyphicons Halflings';
        padding-right: 5px;
    }

UI 在警報消息之前顯示禁止圓圈，但它也在禁止圓圈之前顯示點。 該點來自用戶代理樣式表。 我有<!DOCTYPE html>在這個SO中建議

如何擺脫用戶代理樣式中的點？

Answer 1

您可以使用 CSS 值 none 的 list-style-type 屬性來消除點。 您可以在此處進一步了解該物業。

我在以下代碼中使用了它：

 .alert { padding: 5px; margin-bottom: 5px; color: white; }.alert-error { background-color: rgb(186, 39, 39); } /*Using a Bootstrap glyphicon as ban-circle*/.alert-error li:before { content: "\e090"; font-family: 'Glyphicons Halflings'; padding-right: 5px; } ul { list-style-type: none; }

 <,DOCTYPE html> <html lang="en"> <head> <,-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width. initial-scale=1. shrink-to-fit=no"> <link rel="stylesheet" href=",/style.css"> <title>Hello, world!</title> </head> <body> <div class="alert alert-error" role="alert"> <ul> <li>This is test message.</li> </ul> </div> </body> </html>

覆蓋 li 元素的用戶代理樣式

問題描述

1 個解決方案

解決方案1
2 已采納 2021-02-25 18:10:34

覆蓋 li 元素的用戶代理樣式

問題描述

1 個解決方案

解決方案1 2 已采納 2021-02-25 18:10:34

解決方案1
2 已采納 2021-02-25 18:10:34