html里的ul和Li的区别是什么

1、定义不同

ul 是 Unordered List（无序列表）的缩写。<li>标签定义列表项目（li是lists的缩写）。

2、用法不同

<ul>标签定义无序列表。使用 <li>标签定义的列表可以是个无序列表也可以是有序列表。

3、支持的HTML全局属性不同

<li>标签支持所有的HTML 全局属性。<ul>标签支持 HTML 中的全局属性：accesskey、class、dir、id、lang、style、tabindex、title。

4、属性不同

<ul>标签中的属性：compact、type。<ul>标签：id, class, title, style, dir, lang, xml:lang。

5、元素级别不同

ul 是块级元素可以定义宽和高，li表示行排列不能单独使用，需要在ul和ol里面，配合使用。

我们一般用的li是与ul或者是ol一直连用的。<ul>是无序列表，<ol>是有序列表。

<ul>

<li>Coffee</li>

<li>Milk</li>

</ul>

显示如图，每个列表项前面是个小圆圈。

<ol>

<li>Coffee</li>

<li>Milk</li>

</ol>

显示如下图，每个列表项前面是数字。

我们用的无序列表比较多，也就是ul li。我们拿ul li做比例，我们会给ul设置一个class，把他们的默认的margin和padding，还有前面的小圆点去掉。

<ul class="aa">

<li>Coffee</li>

<li>Milk</li>

</ul>

.aa {

margin: 0//去掉默认margin

padding: 0 //去掉默认padding

list-style: none  //去掉前面的小圆圈

}

.aa li {

padding-left: 20px//给小图标留出前面的位置

background: url(...) no-repeat left center//如果想给每个列表项前面换个小图标，可以这样把小图标以图片的形式引入

}

<li>标签定义了列表项目。<li>标签可用在有序列表 (<ol>) 和无序列表 (<ul>) 中。

例子:

<ol>

<li>Coffee</li>

<li>Tea</li>

</ol>

<ul>

<li>Coffee</li>

<li>Tea</li>

</ul>

因为在frontpage设计页面的时候不加载CSS样式,你可以在frontpage中点预览才能看到页面

---