基本用法:
<ul type="cir">
<li>显示数据</li>
<li>显示数据</li>
</ul>
type可用的选项有三个:
circle 空心圆形
disc 实心圆形
square 方块
来看下面的代码:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>无序列表</title>
</head>
<body>
<ul>
<li>光辉岁月</li>
<li>大地</li>
<li>灰色轨迹</li>
</ul>
</body>
</html>
显示的效果如下:
想为这个列表添加一个背景色,该怎么做呢？？
修改后的代码如下:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>无序列表</title>
</head>
<body>
<ul style="background-color: pink;">
<li>光辉岁月</li>
<li>大地</li>
<li>灰色轨迹</li>
</ul>
</body>
</html>
显示效果如下:
把列表前面的实心加点改成空心圆点,要加type属性.
修改后的代码如下:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>无序列表</title>
</head>
<body>
<ul style="background-color: pink;" type="circle">
<li>光辉岁月</li>
<li>大地</li>
<li>灰色轨迹</li>
</ul>
</body>
</html>
修改后的效果如下:
更改成功了.
同样的,想把列表前面改成空心正方形,只需要把type的属性值修改为"square"就可以了.