CSS的ul和li完成横向排序和去掉li的点

2021-03-09 01:45 jianzhan
今日做网页页面是总是不懂如何完成ul的横向排序和去掉li那个烦人的点,如今寻找方式了,做个笔记:

拷贝编码
编码以下:

#ul {
float:left;
}
#ul li {
float:left;
list-style:none;
}

顺带扩展1下li的list-style:

拷贝编码
编码以下:

ul {
list-style:square inside url('.../.img');
}
ul {
list-style:circle;
}
ol {
list-style:upper-roman;
}
ol {
list-style:lower-alpha;
}

再写个今日看到的物品,是有关dl,dt,dd的,实际上便是相近于子类的,我较为罕见到各个网页页面上用:

拷贝编码
编码以下:

<dl>
<dt>Apple</dt>
<dd>iPhone</dd>
<dt>Boy</dt>
<dd>男孩</dd>
</dl>

实际效果以下: