一、使用伪类选择器和counter属性
div>div{
counter-increment: count;
}
div>div:before{
content: counter(count,disc);
}
首先指定计算器的名字,再使用:before伪类选择器插入到div前面,使得有列表的效果。
counter(名字,样式)第一个参数是指定计算器的名字,第二个参数是列表项的样式,如实心圆,空心圆,罗马字等。
二、使用属性display:list-item
display有许多属性,如table、table-row,可将非表格元素组合为表格的样式,而list-item则表现为列表的样式,然后用list-style-type指定项目标志。
/*css样式*/
#list{
display: list-item;
list-style: square;
}
/*html内容*/
<div id="#list">
<div>a</div>
<div>b</div>
<div>c</div>
</div>
PS:文本框做成下拉列表框的效果
<input type="text" list="aa" name="b">
<datalist id="aa">
<option>a</option>
<option>b</option>
<option>c</option>
</datalist>
注意两者的id要相对应。