1.1ul无序列表标签

基本构造:

<ul>

html5商品列表模板HTML5常见的基本标签五列表标签和表格标签的应用 NoSQL

<li>国际新闻</li>

<li>海内新闻</li>

<li>军事热点</li>

<li>数码、科技</li>

<li>时装</li>

</ul>

把稳:

1.ul标签和li标签是组合利用。

2.li标签里面可以添加任何内容,或者嵌套标签也可以

3.无序列表会自动天生一个小圆点,一样平常在实际运用中会去掉。

1.2有序列表ol

语法:定义子项顺序的。
一样平常有编号(数字或字母或希腊字母)

<ol>

<li>小西瓜</li>

</ol>

把稳:

有序列表type属性的几个值:

A表示显示的编号是大写字母

a表示编号是小写字母

I表示编号是罗马数字

i表示编号是小写罗马数字

默认情形下显示的是数字

实例:

<ol type=\"大众1\"大众 start=\"大众5\"大众>

<li><a href=\"大众\公众>小苹果</a></li>

<li><a href=\"大众\"大众>小西瓜</a></li>

<li><a href=\"大众\"大众>草莓</a></li>

<li><a href=\"大众\"大众>西红柿</a></li>

<li><a href=\"大众\"大众>猕猴桃</a></li>

<li><a href=\公众\公众>蓝莓</a></li>

</ol>

<ol type=\公众a\"大众 >

<li><a href=\"大众\"大众>小苹果</a></li>

<li><a href=\公众\公众>小西瓜</a></li>

<li><a href=\"大众\公众>草莓</a></li>

<li><a href=\"大众\"大众>西红柿</a></li>

<li><a href=\公众\公众>猕猴桃</a></li>

<li><a href=\公众\"大众>蓝莓</a></li>

</ol>

<ol type=\公众A\"大众>

<li><a href=\"大众\"大众>小苹果</a></li>

<li><a href=\"大众\"大众>小西瓜</a></li>

<li><a href=\"大众\"大众>草莓</a></li>

<li><a href=\"大众\公众>西红柿</a></li>

<li><a href=\公众\公众>猕猴桃</a></li>

<li><a href=\公众\公众>蓝莓</a></li>

</ol>

<ol type=\"大众i\"大众>

<li><a href=\"大众\"大众>小苹果</a></li>

<li><a href=\"大众\"大众>小西瓜</a></li>

<li><a href=\"大众\公众>草莓</a></li>

<li><a href=\公众\"大众>西红柿</a></li>

<li><a href=\"大众\"大众>猕猴桃</a></li>

<li><a href=\"大众\"大众>蓝莓</a></li>

</ol>

<ol type=\"大众I\"大众>

<li><a href=\"大众\"大众>小苹果</a></li>

<li><a href=\公众\公众>小西瓜</a></li>

<li><a href=\"大众\"大众>草莓</a></li>

<li><a href=\"大众\公众>西红柿</a></li>

<li><a href=\"大众\"大众>猕猴桃</a></li>

<li><a href=\公众\"大众>蓝莓</a></li>

</ol>

2.3定义列表dl

什么是定义列表

dl标签定义了定义列表,常日用于名称的阐明或者观点的定义。
每个子项分为2个部分,一部分卖力定义,另一部分卖力阐明

<dl>

<dt>打算机资料</dt>

<dd>H5前端开拓</dd>

<dd>JavaScript</dd>

<dd>NodeJS入门到精通</dd>

<dd>PhP语法入门到精通</dd>

<dt>文学书本</dt>

<dd>诗歌</dd>

<dd>小说</dd>

<dd>散文</dd>

</dl>

<!--

dl:定义了一个定义列表

dt:术语部分

dd:对术语或项目进行阐明的部分

-->

2. 表格table

2.1表格的利用

(1)table标签

(2)表格行、列的合并

<table>:定义表格

<tr>:定义表格的行

<td>:定义表格的列

<th> :定义表格表头单元格

<thead>:定义表格中表头的内容

<tbody>:定义表格中的主体内容

<tfoot>:定义表格中的脚注

<caption>:定义表格标题

<!--

cellspacing:单元格与单元格之间的间隔

cellpadding:内容与单元格之间的间隔

border:单元格边框宽度

bgcolor:设置背景色

-->

<table width=\公众360\公众 border=\公众1\"大众 cellspacing=\"大众0\公众 cellpadding=\"大众0\"大众 align=\"大众center\"大众 >

<tr bgcolor=\"大众aqua\"大众><th>学号</th><th>姓名</th></tr>

<tr align=\"大众center\公众><td>001</td><td>张三</td></tr>

<tr align=\"大众center\"大众><td>002</td><td>李四</td></tr>

<tr align=\"大众center\"大众><td>003</td><td>王五</td></tr>

<tr align=\公众center\公众><td>004</td><td>赵六</td></tr>

</table>

2.2表格的合并(行合并、列合并)

<p>

表格列的合并

</p>

<table width=\公众360\公众 border=\"大众1\"大众 cellspacing=\"大众0\公众 cellpadding=\"大众0\"大众 align=\"大众center\"大众 >

<tr align=\"大众center\公众><td colspan=\"大众2\公众 >高一三班学员表</td></tr>

<tr bgcolor=\"大众aqua\"大众><th>学号</th><th>姓名</th></tr>

<tr align=\"大众center\公众><td>001</td><td>张三</td></tr>

<tr align=\公众center\"大众><td>002</td><td>李四</td></tr>

<tr align=\公众center\"大众><td>003</td><td>王五</td></tr>

<tr align=\公众center\"大众><td>004</td><td>赵六</td></tr>

</table>

<hr />

<p>表格行的合并</p>

<table width=\公众360\"大众 border=\公众1\"大众 cellspacing=\"大众0\"大众 cellpadding=\"大众0\"大众 align=\"大众center\公众>

<tr bgcolor=\公众aqua\公众><th>产品颜色</th><th>型号</th></tr>

<tr><td rowspan=\公众3\"大众>玄色</td><td>L</td></tr>

<tr><td>S</td></tr>

<tr><td>M</td></tr>

<tr><td rowspan=\公众3\"大众>白色</td><td>L</td></tr>

<tr><td>XL</td></tr>

<tr><td>XXL</td></tr>

</table>