如何修改列表项li、ul前的圆点小方块

如何修改列表项li、ul前的圆点小方块

ID:34711871

大小:48.11 KB

页数:3页

时间:2019-03-09

如何修改列表项li、ul前的圆点小方块_第1页
如何修改列表项li、ul前的圆点小方块_第2页
如何修改列表项li、ul前的圆点小方块_第3页
资源描述:

《如何修改列表项li、ul前的圆点小方块》由会员上传分享,免费在线阅读,更多相关内容在工程资料-天天文库

1、如何修改列表项li、ul前的圆点小方块解决思路:在HTML中没有相应的属性可以设置该效果,但在CSS中可以,相应的属性为list-style-type,要把圆点改成实心方块解决思路:在HTML中没有相应的属性可以设置该效果,但在CSS中可以,相应的属性为list-style-type,要把圆点改成实心方块,只需要设置list-style-type的值为square。具体步骤:代码示例:ullilist1lilist2lilist3lilist4/ul技巧:想必大家都注意到,列表项离左边有很大一段距离,利用前面学过的知识

2、,设置margin-left属性就行了:ullilist1lilist2lilist3lilist4/ul另外,如果要把小黑点换成自定义图片,可以用list-style-image,用法:list-style-image:url提示:对于列表项目,还有一个list-style-position属性可以定义,主要用于设置列表项前的符号根据列表文字的排列方式,对应的脚本特性为listStylePosition。可选值的说明outside列表项目符号在文本以外,文本不根据标记对齐。inside列表项目符号在文本以内,文本根据

3、标记对齐。特别提示本例代码运行效果如图2.1.6.9所示,原本为实心圆点的列表符号现在已经变成了实心方块。图2.1.6.9自定义列表项前的符号特别说明list-style-type属性用于设置列表项目前的符号,对应的脚本特性为listStyType,可选值及说明如表2.1.6.1所示。list-style-image属性用于设置列表项目前的自定义图片,对应的脚本特性为listStyleImage。如果同时设置list-style-image和list-style-type,则list-style-type属性将被忽略,

4、除非list-style-image的值设置为none或指定的图片不可用,list-style-type才有作用。list-style-type、list-style-position和list-style-image的复合属性为list-style。表2.1.6.1list-style-type属性的可选值可选值说明none不使用项目符号disc实心圆,默认值circle空心圆square实心方块decimal阿拉伯数字lower-roman小写罗马数字upper-roman大写罗马数字lower-alpha小写英文

5、字母upper-alpha大写英文字母

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。