HTML1列表表格

1.无序列表

<ul type="square"> 通过type属性设置项目符号,disc(默认),square和circle
      <li>   1  </li>
      <li>   2  </li>
</ul>

2.有序列表

<ol type="I"> 通过type属性设置项目顺序,1(数字默认),A(大写字母),a(小写字母),I(大写罗马字母),i(小写罗马字母)
       <li>   1  </li>
       <li>   2  </li>
</ol>

3.列表

<dl>
      <dt>  1 </dt>
        <dd>   1.1  </dd>
        <dd>   1.2  </dd>
      <dt>  2 </dt>
        <dd>  2.1  </dd>
</dl>

4.表格

<table border="1"  cellspacing="0"行间距  cellpading="5"字框距> 表格标签
   <tr>行标签
         <th>表头</th>
         <th>表头</th>
    </tr>
    <tr>行标签
         <td>第一个单元格的内容</td>
         <td>第二个单元格的内容</td>
    </tr>
    <tr>
        <td>第一个单元格的内容</td>
    </tr>
</table>

align(水平对齐方式): center,left,right
valign(垂直对齐方式):

表格的跨列:colspan="n"
      跨行: rowspan="n"

表格的CSS属性:
border-spacing 单元格间距
table-layout auto/fixed 自动表格布局/固定表格布局

单线表格实例:

<head>
    <style type="text/css">
        .t{
           width=270px;
           height=90px;
           border-spacing=0;
         }
         .t td{
            border-bottom:3px solid;
          }
    </style>                css部分设置单线表格样式
</head>  

<body>
    <table class="t">
        <hr>  
               <hd>1</hd>
               <hd>2</hd>
               <hd>3</hd>
        </hr>
        <hr>  
               <hd>1.1</hd>
               <hd>2.1</hd>
               <hd>3.1</hd>
        </hr>
        <hr>  
               <hd>1.2</hd>
               <hd>2.2</hd>
               <hd>3.2</hd>
        </hr>
    </table>
</body>

猜你喜欢

转载自blog.csdn.net/qq_35076836/article/details/86243326
今日推荐