css怎么控制li和ul的边距

html-css023

css怎么控制li和ul的边距,第1张

css控制li和ul的边距,可以使用margin属性来实现或者padding属性都可以，在设置width和height属性时，计算好各自的距离，然后设置多少px就可以实现，下面介绍了一下简单的控制和去掉li前面圆点的方法

一、CSS控制ul缩进间距的方法：

<style type="text/css">

ul{margin-left:-10px}

</style>

<ul>

<li>XXX</li>

</ul>

二、CSS去掉li点的三种方法：

方法一：

<ul>

<li style="list-style-type:none">XXX</li>

<li style="list-style-type:none">XXX</li>

<li style="list-style-type:none">XXX</li>

<li style="list-style-type:none">XXX</li>

</ul>

方法二：

<style type="text/css">

li{list-style-type:none}

</style>

<ul>

<li>XXX</li>

<li>XXX</li>

<li>XXX</li>

<li>XXX</li>

</ul>

方法三：

<style type="text/css">

.li_style{list-style-type:none}

</style>

<ul>

<li class="li_style">XXX</li>

<li class="li_style">XXX</li>

<li class="li_style">XXX</li>

<li class="li_style">XXX</li>

</ul>

使用css语句：line-height

通过设置不同的line-height值得到不同间距。

代码：

效果：

扩展资料：

line-height的可以设置三种方式：像素，百分比，数值。

参考资料：w3school--line-height