如何控制<li>里的点
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何控制<li>里的点相关的知识，希望对你有一定的参考价值。
如何控制<li>里的点
css 管控--------------------------------------------------------------------------
用CSS定义li样式
li的这个样式定义是将列表项目使用图片来代替显示的小圆点。当然您也可以显示成其它效果，详细请参阅下面的定义:
列表项目效果的CSS定义
li list-style-image: url(images/disc.gif);
*list-style-type: circle(可换成自己想要的样式); 列表项目样式
disc : CSS1 实心圆
circle : CSS1 空心圆
square : CSS1 实心方块
decimal : CSS1 阿拉伯数字
lower-roman : CSS1 小写罗马数字
upper-roman : CSS1 大写罗马数字
lower-alpha : CSS1 小写英文字母
upper-alpha : CSS1 大写英文字母
none : CSS1 不使用项目符号
armenian : CSS2 传统的亚美尼亚数字
cjk-ideographic:CSS2 浅白的表意数字
georgian : CSS2 传统的乔治数字
lower-greek : CSS2 基本的希腊小写字母
hebrew : CSS2 传统的希伯莱数字
hiragana : CSS2 日文平假名字符
hiragana-iroha: CSS2 日文平假名序
katakana : CSS2 日文片假名字符
katakana-iroha: CSS2 日文片假名序号
lower-latin : CSS2 小写拉丁字母
upper-latin : CSS2 大写拉丁字母
*list-style-image: url(images/disc.gif); 用图像disc.gif代替列表项目显示
*list-style-position : outside | inside
outside: 列表项目标记放置在文本以外，且环绕文本不根据标记对齐
inside : 列表项目标记放置在文本以内，且环绕文本根据标记对齐
、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、
list-style-type版本：CSS1/CSS2 兼容***：IE4+ NS4+ 继承***：有
语法：
list-style-type : disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none | armenian | cjk-ideographic | georgian | lower-greek | hebrew | hiragana | hiragana-iroha | katakana | katakana-iroha | lower-latin | upper-latin
参数：
disc : CSS1 实心圆
circle : CSS1 空心圆
square : CSS1 实心方块
decimal : CSS1 阿拉伯数字
lower-roman : CSS1 小写罗马数字
upper-roman : CSS1 大写罗马数字
lower-alpha : CSS1 小写英文字母
upper-alpha : CSS1 大写英文字母
none : CSS1 不使用项目符号
armenian : CSS2 传统的亚美尼亚数字
cjk-ideographic : CSS2 浅白的表意数字
georgian : CSS2 传统的乔治数字
lower-greek : CSS2 基本的希腊小写字母
hebrew : CSS2 传统的希伯莱数字
hiragana : CSS2 日文平假名字符
hiragana-iroha : CSS2 日文平假名序号
katakana : CSS2 日文片假名字符
katakana-iroha : CSS2 日文片假名序号
lower-latin : CSS2 小写拉丁字母
upper-latin : CSS2 大写拉丁字母
说明：
设置或检索对象的列表项所使用的预设标记。
若list-style-image属***为none或指定图像不可用时，list-style-type属***将发生作用。
仅作用于具有display值等于list-item的对象（如li对象）。
注意：ol对象和ul对象的type特***为其后的所有列表项目（如li对象）指明列表属***。请参阅我的其他著作。
IE5.5尚不支持所有CSS2的值。
对应的脚本特***为listStyleType。 参考技术A
你自己看下吧 实在太多了
用js控制父元素中的子元素，不要用css，大神请进
举个例子
<div class="dad">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
一共有10个li
他们的背景颜色都是#000黑色
但我想改变从第四个li开始到第十个li的背景颜色，变成red；
用js来做，不要用css，我就想知道如何操作
for(var i = 3;i<oLis.length;i++)
oLis[i].style.backgroundColor = "red";
这个是原生js写的，因为用的getElementsByClassName有兼容性问题，我就不写解决的函数了
$(".dad").find("li").slice(3).css("backgroundColor","red")
)
这个是用JQ写的
这两个你要哪个拿哪个，不懂追问，反正这是小问题，满意劳烦采纳，实在需要原声兼容我补充给你
参考技术A <html><script src="jquery-1.9.1.js"></script>
<style type="text/css">
liwidth:20px;height:20px;background:black;margin-top:20px;
</style>
<body>
<div class="dad">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<script>
$(function()
var obj = $(".dad").find("li");
$.each(obj,function(k,v)
if(k >= 3)
$(this).css("background","red");
)
);
</script>
</body>
</html>本回答被提问者采纳
以上是关于如何控制<li>里的点的主要内容，如果未能解决你的问题，请参考以下文章