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

零下一度
Lepaskan: 2017-06-24 11:58:41
asal
1488 orang telah melayarinya

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

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

(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>
Salin selepas log masuk

效果

二、无序列表

    无序列表属性:
      
  •    (type属性)
      (是无序列表前边小黑点的属性)
            disc(实心圆) circle(空心圆) square(方块)

    代码

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

    效果 

     

    三、有序列表

    有序列表:

             有序列表属性:
        
    1. (type属性)

             1(按数字1.2.3...往下排) A(按大写字母A.B.C...往下排) a(按小写字母a。b。c....往下排)
                Ⅰ(按大写罗马数字Ⅰ、Ⅱ、Ⅲ.....往下排)
                (start属性)
        (表示这个有序列表不是默认的从1开始是从2开始的)

        代码

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

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

         

        Atas ialah kandungan terperinci html中表格与列表的实例教程. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan