html中表格与列表的实例教程-html教程-PHP中文网

今天准备为大家准备了表格和列表。" > 今天准备为大家准备了表格和列表。

代码" >代码

效果　" >效果　

代码" >代码

效果按照A,B,C... 往下排 type 只能写那三种" >效果按照A,B,C... 往下排 type 只能写那三种

首页

web前端

html教程

html中表格与列表的实例教程

零下一度

Jun 24, 2017 am 11:58 AM

html 基础表格

今天准备为大家准备了表格和列表。

一、文章有各种数据的表格这个网页也不例外。

（1）、标签意思　

----------------------表格开始
　　-------表格标题
　　　　--------------------行开始标签
　　　　　　-------------表头
　　　　　　-------------单元格
　　　　-------------------行结束标签

---------------------表格结束

（2）、表格样式

　　cellpadding 属性设置单元格边框和单元格内容的距离。
　　cellspacing 属性设置单元格之间的距离。
　　border 属性表示边框
width 设置表格的宽。
height 设置表格的高。 [注]：高这个属性最好不小给 table 中写，让它自动撑开就好。但这个可以给 tr 给每行需要的高度

代码

<html>
     <head>
	<title>表格</title>
     </head>
     <body>
	<table border="1px" width="500px" cellpadding="10px" cellspacing="10px">
　　		<caption>表格标题</caption>
　　　　		<tr height="50px"> 
　　　　　　		<th>表头</th>
　　　　　　		<th>表头</th>
　　　　		</tr>
		<tr> 
　　　　　　		<td>单元格</td>
　　　　　　		<td>单元格</td>
　　　　		</tr>
	</table>
     </body>
</html>

登录后复制

效果

二、无序列表

代码

<html>
     <head>
	<title>表格</title>
     </head>
     <body>
	 <ul type="circle">       
 		<li>无序列表</li>    
 	 </ul>           

     </body>
</html>

登录后复制

效果　

三、有序列表

有序列表：

代码

<html>
     <head>
	<title>有序列表</title>
     </head>
     <body>
	  <ol type="A">       
   		<li>有序列表</li>  
   		<li>有序列表</li>
   		<li>有序列表</li>   
 	  </ol>                     

     </body>
</html>

登录后复制