将<li>设置成内联块状元素为什么前面的小黑点不见了

来源:12-10 我想脚下踩条线 - 使用border为盒子添加边框(二)

若夫萤雨霏霏

2015-11-10 20:31

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>边框</title>

<style type="text/css">

li{ display:inline-block;

    border-bottom:1px dotted #ccc;

    border-top:1px dotted #ccc;

    margin-bottom:10px;

}

</style>

</head>

<body>

<ul>

    <li>别让不会说话害了你</li>

    <li>二十七八岁就应该有的见识</li>

    <li>别让不好意思害了你</li>

</ul>

</body>

</html>


写回答 关注

3回答

  • 李晓健
    2015-11-10 20:45:57
    已采纳

    有小黑点是因为 他的display属性是 list-item; 而li默认的display就是 list-item  所以就有小黑点,你把li的display改成了 inline-block 小黑点自然就没有了,你可以试试把一个span的display改成list-item 你会发现这个span也有小黑点了。

    若夫萤雨霏霏

    恩恩,谢谢啦!不过我还发现只有在<ul></ul>内部的span(属性改成list-item),li才可以在显示小黑点,当我将span(或li)放在外面时,它们都没有显示小黑点

    2015-11-12 19:47:48

    共 1 条回复 >

  • Y留过长发虽未及腰
    2016-01-28 09:20:08

    块状元素有一个特点之一:在不设置宽度的情况下,显示为父容器的100%。

    border-bottom:1px dotted #ccc;width:200px;height:30px;这样就行了

  • echo_kinchao
    2015-11-12 08:20:42

    因为你已经把他的本质属性给改掉了

初识HTML(5)+CSS(3)-升级版

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

1225318 学习 · 18230 问题

查看课程

相似问题