加入收藏 | 设为首页 | 会员中心 | 我要投稿 聊城站长网 (https://www.0635zz.com/)- 智能语音交互、行业智能、AI应用、云计算、5G!
当前位置: 首页 > 综合聚焦 > 编程要点 > 语言 > 正文

CSS怎样对ul中li的间距展开调整

发布时间:2023-08-28 14:43:34 所属栏目:语言 来源:
导读:这篇文章主要介绍了CSS怎样对ul中li的间距进行调整相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇CSS怎样对ul中li的间距进行调整文章都会有所收获,下面我们一起来看看吧。

在css
这篇文章主要介绍了CSS怎样对ul中li的间距进行调整相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇CSS怎样对ul中li的间距进行调整文章都会有所收获,下面我们一起来看看吧。
 
在css中,可以利用“margin-bottom”属性来改变ul中li的间距,该属性用于设置元素的下外边距,利用该属性给ul中的li元素设置下外边距,进而改变li的间距,语法为“ul li{margin-bottom:间距值;}”。
 
在css中,想要改变ul中li的间距,我们可以使用margin-bottom属性,margin-bottom属性的作用是设置元素的下外边距。
 
该属性的属性值如下:
 
下面我们通过示例来看一下怎样来设置ul中li的间距,示例如下:
 
<!DOCTYPE html>
 
<html lang="en">
 
<head>
 
    <meta charset="UTF-8">
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
    <title>Document</title>
 
    <style>
 
    ul li{
 
        margin-bottom:20px;
 
    }
 
    </style>
 
</head>
 
<body>
 
<p>无序列表:</p>
 
<ul>
 
  <li>雪碧</li>
 
  <li>可乐</li>
 
  <li>凉茶</li>
 
</ul>
 
</body>
 
</html>
 
 

(编辑:聊城站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章