css里面li标签怎么加图片_Html ul、li Css标签详解 使用图片自定义样式 隐藏小点样式齐全...

前排丢一下本文大部分内容机器生成用的代码，贴一下供参考

PHP

关于li标签的用法我在使用过程中也是经常需要临时去查询，为了以后可以更快找到。还是自己总结一下，方便日后查看。

本文涵盖了所有CSS自带的li标签样式效果，以及一个图片形式。(使用图片Url)

引用自定义图片、

语法：

list-style-image : none | url (url)

eg. li {list-style-image : url (image/aa.gif);}

演示

11111111111

引用系统图案

语法：

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: 实心圆

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: 大写拉丁字母

系统图案演示大全

list-style-type:disc

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:circle

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:square

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:decimal

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:lower-roman

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:upper-roman

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:lower-alpha

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:upper-alpha

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:none

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:armenian

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:cjk-ideographic

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:georgian

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:lower-greek

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:hebrew

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:hiragana

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:hiragana-iroha

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:katakana

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:katakana-iroha

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:lower-latin

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

list-style-type:upper-latin

人生得意须尽欢

莫使金樽空对月。

天生我材必有用

千金散尽还复来。

烹羊宰牛且为乐

会须一饮三百杯。

扩展资料(转载)：

要实现UL标签水平居中，关键在于CSS中 display:inline 的运用。

HTML代码具体示例：

注意：如果UL没有设置宽度，用margin:0 autl是没有用的，因为它默认了100%，给它一个宽度，实际宽度或者width:auto都可以。

在HTML中，有两种类型的列表：无序列表 – 列表项标记用特殊图形(如小黑点、小方框等)；有序列表 – 列表项的标记有数字或字母。使用CSS，可以列出进一步的样式，并可用图像作列表项标记。

用CSS设置UL标签的列表符号是不需要去设置的，因为ul默认就是标签符号的，如果使用了这个list-style：none；去掉了这个属性，然后又想有的话，就给这个ul一个id或者是class，然后在css中list-style-type：disc !important，这样就又有序号了。