1、利用Dreamweaver新建一个html页面。
2、在body里面输入代码
<ul>
<li>你好</li>
<li>小鱼</li>
<li>小小</li>
</ul>。
3、默认的样式是这样的。
4、编辑li标签的css样式。
5、float:left代表的是元素左对齐。这样li标签就可以横排显示了,list-style:none用来去除li标签前面的小圆点。
列表<ul><li></li></ul>,其中ul是块级元素,li也是块级元素,怎么知道是不是块级元素?
给他们分别加上不同的background,给他们设定一定的width和height你就可以清晰的知道了。
li标签的css样式名称是current其中要说明的就是楼上说的有点小问题,li是dw的默认标签所以不需要调用class,直接设置完css之后li即可生效。不过它控制的是所有的li.如果要控制单个要分开定义css样式,然后再用class或id调用.
<style>*{ paddding:0 margin:0}
li{ list-style-type:none}
b{font-weight:normalpadding:0 10px}
p{line-height:30px}
</style>
<ul style="font-size:14px color:#eee">
<li>
<b style=" color:#f00 font-size:15px">姓名<b>
<span style="color:#f00 font-size:15px">奖品</span>
</li>
<li>
<p>
<b>姓名</b><span>海盗双人五日游</span>
</p>
<p>
<b>岛封</b><span>海盗双人五日游</span>
</p>
</li>
<li>
<p>
<b>姓名</b><span>海盗双人五日游</span>
</p>
<p>
<b>岛封</b><span>海盗双人五日游</span>
</p>
</li>
<li>
<p>
<b>姓名</b><span>海盗双人五日游</span>
</p>
<p>
<b>岛封</b><span>海盗双人五日游</span>
</p>
</li>
<li>
<p>
<b>姓名</b><span>海盗双人五日游</span>
</p>
<p>
<b>岛封</b><span>海盗双人五日游</span>
</p>
</li>
<li>
<p>
<b>姓名</b><span>海盗双人五日游</span>
</p>
<p>
<b>岛封</b><span>海盗双人五日游</span>
</p>
</li>
</ul>