Html中怎样调整(无序)ul列表中li的上下间距啊

Html中怎样调整(无序)ul列表中li的上下间距啊,第1张

一般来说,调整列表li上下间距方法有两个

第一个是给每个li标签设置绝对高度,如height:25px;

第二个方法是给每个li标签设置行高相对高度,如line-height:150%或line-height:180%;

当然还有其他的方法,这个需要你学号HTML和CSS了,这个设置间距的方法可以使用CSS来完成。

如果是要是列表无缝连接,可以在在CSS代码开始处添加{margin:0;padding:0;}这是设置所有元素间距为零的写法,或者如楼下所说的方法也是可以的。

希望帮助到你!

这是由于浮动的原因,我写两种解决方法,各有各的优缺点;你自己喜欢哪种用哪种:

我图方便都直接用行间定义写了;

例一:

<li style=" display:block; overflow:hidden">

<div style="float:left; height:100px; width:100px"></div>

<div style="float:left; height:100px; width:100px"></div>

</li>

例二:

<li style=" display:block;">

<div style="float:left; height:100px; width:100px"></div>

<div style="float:left; height:100px; width:100px"></div>

<div style="clear:both; height:0; line-height:0; font-size:0"></div>

</li>

li虽然有了高度,但是因为你给li设置了了浮动,所以相当于没有高度,你可以在最后一个li的后面加一个li,单独设置这个li的样式,clear:both; 这样的话 ul 应该是有高度的,你可以按照我说的先试一下,给ul加个背景色就能看出来ul的高度了

以上就是关于Html中怎样调整(无序)ul列表中li的上下间距啊全部的内容,包括:Html中怎样调整(无序)ul列表中li的上下间距啊、div里的li高度问题~、div/ul 无法获取与设置自动适合高度等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/9873822.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-02
下一篇2023-05-02

发表评论

登录后才能评论

评论列表(0条)

    保存