首頁 > 文章 > web前端 > css ul標籤怎麼去掉圓點

css ul標籤怎麼去掉圓點

青灯夜游原創: 2022-04-25 17:55:5312826瀏覽

在css中，可用list-style-type屬性來去掉ul的圓點標記，語法為「ul{list-style-type:none}」；list-style-type屬性可設定列表項標記的類型，當值為「none」可不定義標記，也可移除已有標記。

css ul標籤怎麼去掉圓點

本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

HTML ul標籤可以無序列表，清單中的每一個選項都使用li標籤定義。

HTML ul無序列表預設使用圓點作為選項標記：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML无序列表</title>
</head>
<body>
    <p>早餐的种类：</p>
    <ul>
        <li>鸡蛋</li>
        <li>牛奶</li>
        <li>面包</li>
        <li>生菜</li>
    </ul>
</body>
</html>

css ul標籤怎麼去掉圓點

那麼怎麼移除這些圓點標記呢？可以利用css。

在css中，可以利用list-style-type屬性來移除無序列表的圓點標記。

list-style-type屬性可以設定清單項目標記的類型，當屬性值設定為「none」可不定義標記，也可移除現有的預設標記。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML无序列表</title>
<style>
ul{
list-style-type:none;
}
</style>
</head>
<body>
    <p>早餐的种类：</p>
    <ul>
        <li>鸡蛋</li>
        <li>牛奶</li>
        <li>面包</li>
        <li>生菜</li>
    </ul>
</body>
</html>

css ul標籤怎麼去掉圓點

（學習影片分享：css影片教學、web前端）

以上是css ul標籤怎麼去掉圓點的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：es6與es5的建構子有什麼差別下一篇：es6與es5的建構子有什麼差別

看更多