ul li 浮动属性下如何加点

ul,li{margin:0padding:0list-style:none}

li{background:url(图标路径) no-repeat 0 50%padding-left:8px}

仅作参考

解决思路：

在HTML中没有相应的属性可以设置该效果，但在CSS中可以，相应的属性为list-style-type，要把圆点改成实心方块，只需要设置list-style-type的值为square。

具体步骤：

代码示例：

<ul style="list-style-type:square">

<li>list1

<li>list2

<li>list3

<li>list4

</ul>

技巧：想必大家都注意到，列表项离左边有很大一段距离，利用前面学过的知识，设置margin-left属性就行了：

<ul style="list-style-type:squaremargin-left:12px">

<li>list1

<li>list2

<li>list3

<li>list4

</ul>

另外，如果要把小黑点换成自定义图片，可以用list-style-image，用法：

list-style-image:url(demo.gif)

提示：对于列表项目，还有一个list-style-position属性可以定义，主要用于设置列表项前的符号根据列表文字的排列方式，对应的脚本特性为listStylePosition。可选值的说明如下：

outside 列表项目符号在文本以外，文本不根据标记对齐。

inside 列表项目符号在文本以内，文本根据标记对齐。

可选值说明

none不使用项目符号

disc实心圆，默认值

circle空心圆

square实心方块

decimal阿拉伯数字

lower-roman小写罗马数字

upper-roman大写罗马数字

lower-alpha小写英文字母

upper-alpha大写英文字母

1、使用jquery脚本库，因此先引入jquery脚本文件。

2、html代码里，就是一个ul列表，里面有二个img控件，还有一个按钮。要注意的是给ul加了一个样式名。

3、使用jquery，先为按钮添加一个点击事件。

4、在点击事件函数里，我们直接使用js代码就能获取到img控件了，var imgs = $(".jy_ul li img")

这就是使用jquery的方便，ul列表的样式名，然后按层次 li img的控件名，就能获取到图片控件了。

5、用alert输入图片的src属性来验证获取到的数据是否准确。因为有两个图片控件，所以代码里获取到的是一个数组，我们输出第二个图片的src。

6、运行页面，可以看到有二个图片和一个按钮，点击按钮。

7、点击后d出了第二张图片的src属性，对比代码，数据正确。

---