list-style和div标签

<h1 class="L1">全部商品分类</h1>
<ul>
  <li><a href="#">图书</a>&nbsp;&nbsp;<a href="#">音像</a>&nbsp;&nbsp;<a href="#">数字商品</a></li>
  <li><a href="#">家用电器</a>&nbsp;&nbsp;<a href="#">手机</a>&nbsp;&nbsp;<a href="#">数码</a></li>
  <li><a href="#">电脑</a>&nbsp;&nbsp;<a href="#">办公</a></li>
  <li><a href="#">家居</a>&nbsp;&nbsp;<a href="#">家装</a>&nbsp;&nbsp;<a href="#">厨具</a></li>
  <li><a href="#">服饰鞋帽</a>&nbsp;&nbsp;<a href="#">个性化妆</a></li>
  <li><a href="#">礼品箱包</a>&nbsp;&nbsp;<a href="#">钟表</a>&nbsp;&nbsp;<a href="#">珠宝</a></li>
  <li><a href="#">食品饮料</a>&nbsp;&nbsp;<a href="#">保健食品</a></li>
  <li><a href="#">彩票</a>&nbsp;&nbsp;<a href="#">旅行</a>&nbsp;&nbsp;<a href="#">充值</a>&nbsp;&nbsp;<a href="#">票务</a></li>

</ul>

我们在body标签里面输入这些代码

浏览器运行一下

是这个样子的

我们把主题稍微修改一下

list-style

none 是去掉圆点的意思

如图所示

div标签

我们给他们加上背景颜色

但是太大了，我们只想要小一点的。

有2种更改方式

第一种是在标签里面更改

就会发现他变小了

但是要改的多了

一个一个添加太麻烦

就需要用到我们div标签了

把要更改的文本标签放入div标签里面

就会发现可以统一操作了

注意

其实div标签和span标签一样可以更改。

用它只是在遵循规范