• html基础-表格-列表(4)


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

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

    (1)、标签意思 

    <table>----------------------表格开始
      <caption></caption>-------表格标题
        <tr>--------------------行开始标签 
          <th></th>-------------表头 
          <tb></tb>-------------单元格 
        </tr>-------------------行结束标签 
    </table>---------------------表格结束

    (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>
    

    效果

    二、无序列表

    <ul> 无序列表属性:
      <li></li>    (type属性) <ul type="dise">(是无序列表前边小黑点的属性)
    </ul>         disc(实心圆) circle(空心圆) square(方块)

    代码

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

    效果 

     

    三、有序列表

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

    代码

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

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

  • 相关阅读:
    深入理解计算机系统cp1:存储单位与编码
    25个JavaScript数组方法代码示例
    中间人攻击,HTTPS也可以被碾压
    用了这么久HTTP, 你是否了解Content-Length?
    C#证明静态方法中的成员在线程之间是独立的
    ASP.NET Core Web API官方文档(链接)
    C#中,隐式转换(implicit)和显式转换(explicit)重载方法,不支持将接口类型作为转换的源类型或目标类型
    ASP.NET Core MVC 和Razor页面中的模型验证(链接)
    C#中JSON字符串中的转义字符
    使用文件流,读写网络共享盘
  • 原文地址:https://www.cnblogs.com/durenlong/p/6986612.html
Copyright © 2020-2023  润新知