首页 > 代码库 > 今天学习了无序列表和有序列表和使用HTML5创建表格

今天学习了无序列表和有序列表和使用HTML5创建表格

2024-08-17 02:32:04   219人阅读

ol建立有序列表，该列表可以用设置type=”A/a”

其语法架构为

<ol>

<li></li>

<li></li>

</ol>

Ul建立无序列表, 该列表可以用设置type=” disc/circle/square”

其语法架构为

<ul>

<li></li>

<li></li>

</ul>

 

创建表格其基本属性有

Cellspacing:定义边框与边框的间距大小

Cellpadding:定义边框与内容的间隙大小

Bgcolor：定义表格的背景颜色

Width：定义表格的宽度

Height：定义表哥的高度

Caption:创建表格的标题

Colspan：合并左右单元格

 Rowspan：合并上下单元格

Th：定义标题内容

Dd/dl：自定义列表

Mark：重点提示

附:

<!doctype html>

<html>

 <head>

  <meta charset="UTF-8">

  <title>20161018</title>

 </head>

 <body>

 <ul>

 <li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

  <li>姑苏城外寒山寺</li>

 <li>夜半钟声到客船</li>

 </ul>

 <ul type="disc">

<li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

 </ul>

 <ul type="circle">

<li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

 </ul>

 <ul type="square">

 <li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

 </ul>

 

  <ol type="A">

 <li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

  <li>姑苏城外寒山寺</li>

 <li>夜半钟声到客船</li>

 </ol>

  <ol>

 <li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

  <li>姑苏城外寒山寺</li>

 <li>夜半钟声到客船</li>

 </ol>

  <!-- 建立嵌套的ul/ol列表 -->

<ol type="A">

 <li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

<ul>

 <li>月落乌啼霜满天</li>

 <li>江枫渔火对愁眠</li>

 </ul>

<ol type="a">

  <li>姑苏城外寒山寺</li>

 <li>夜半钟声到客船</li>

</ol>

</ol>

<!-- 自定义列表 -->

<dl>

<dt>电脑</dt>

<dd>是一种能够按照程序运行的电子设备</dd>

<dt>显示器</dt>

<dd>以视觉方式显示信息的装置</dd>

</dl>

<!-- 使用HTML5创建表格

<table>...</table> - 定义表格

<tr> - 定义表行

<th> - 定义表头

<td> - 定义表元

 其语法结构为

 <table>

 <tr>

 <td></td>

<td></td>

<td></td>

 </tr>

 </table>

 -->

 <!-- 创建一个三行三列的表格 -->

 <table border="2px"  cellpadding="2px" cellspacing="20px" bgcolor="DDSSAA">

 <caption>创建一个三行三列的表格</caption>

 <tr>

 <th>姓名</th>

  <th>学号</th>

  <th>成绩</th>

 

 </tr>

 <tr>

 <td align="left">1</td>

<td align="center">1</td>

<td align="rigth">1</td>

 </tr>

 <tr>

 <td>1</td>

<td>1</td>

<td>1</td>

 </tr>

  <tr>

 <td align="left">1</td>

<td align="center">1</td>

<td align="rigth">1</td>

 </tr>

 </table>

 <br/>

 

<table border="2px"  cellpadding="2px" cellspacing="20px" bgcolor="pppppp">

 <caption>创建一个一行三列表格</caption>

 <tr>

 <td bgcolor="red">1</td>

<td bgcolor="green">1</td>

<td bgcolor="blue">1</td>

 </tr>

 </table>

<!-- 单元格的合并 -->

<br/><br/>

<table width="40" height="40" border="1" cellpadding="20px" cellspacing="3px">

  <tr>

    <td colspan="2" align="center">1</td>

    <td rowspan="2" align="center">2</td>

  </tr>

  <tr>

    <td rowspan="2" align="center">3</td>

    <td align="center">5</td>

  </tr>

  <tr>

    <td colspan="2" align="center">4</td>

  </tr>

</table>

 

<br/><br/>

 </body>

</html>

今天学习了无序列表和有序列表和使用HTML5创建表格


联系
我们