Question

div+css 如何设置 Li 样式点与内容的距离

Answer 1

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html，编写问题基础代码。

2、在index.html中的<style>标签中，输入css代码：li{padding-left: 50px;}。

3、浏览器运行index.html页面，此时li样式点与内容的距离设置到了50px。

Answer 2

控制li元素的左内边距即可：

li{padding-left:10px;}  /*设置li样式点与内容间距为10px*/

示例如下：

• 分别将三个列表项设置为不同的左边距，注意观察效果。
  

1. 创建Html元素

   <ul>
   	<li class="li_1">itemlisy-1</li>
   	<li class="li_2">itemlisy-2</li>
   	<li class="li_3">itemlisy-3</li>
   </ul

2. 设置css样式

   ul{ width:150px; height:100px; padding:5px 30px; border:4px solid #ebcbbe;}
   li{padding:5px 0;}
   li.li_1{padding-left:5px;}
   li.li_2{padding-left:15px;}
   li.li_3{padding-left:25px;}

3. 观察显示效果

   

Answer 3

你应该一开始就直接定义初始样式：ul,li{margin:0px; padding:0px; list-style:none; }距离是因为margin和padding是有初始属性的，所以要重新定义下，list-style是li前面那排小点。设置为none可以把那些小点去掉。。祝你好运

Answer 4

建议不要用默认的点，在不同浏览器点大小不同
ul,li{margin:0; padding:0;list-style:none;}
先去点，然后用背景点做上去，
li{background:url(dian.gif) 0 50% no-repeat; padding-left:10px;}

Answer 5

<style type="text/css">
li{list-style-type: disc;list-style-position: inside;}
li span{margin-left: -10px;}
</style>

<ul>
  <li><span>asdfg</span></li>
  <li><span>asdfg</span></li>
</ul>

如上所示：li里面加span，并给span设置margin-left为负值