ul ol列表+table表格

一:列表

1、有序列表ol type 1,i,A,a,I

<ol>

<li>1</li>

<li>2</li>

</ol>

2、无序列表ul 存在三个type

① circle 空心圆Ο

②disc实心圆•

③square方块♦

<ul>

<li>

1

</li>

<li>

12

</li>

</ul>

二:表格

<table>

<caption></caption>标题

<tr>          行

<td></td> 列

</tr>

</table>

其中重点——行列合并(存在于td中):

    ①rowspan:行合并 如:rowspan=“2” 合并两行






    ②colspan:列合并 如: colspan=“3” 合并3列

 
     


    ps:表格的特性:等宽等高,当你设置一个单元格的大小时,与他同一行的其他单元格的高度跟他一样,与他同一列的宽度跟他一样(上下左右共战180的直线)

     
     
     

<table border="1px" width="500px" height="500px">表格粗细 像素px 宽度 长度

<tr>
        <td>ni</td>
        <td colspan="2">你</td> 合并之后删除后面一个单元格,可以跨列合并(并且可以跨行合并)
    </tr>
    <tr>
        <td rowspan="2">你</td>
        <td rowspan="2" colspan="2">你</td>--一个单元格占据两行两列,其余单元格删除(原理即保持表格大小和单元格数的持平)
     </tr>

</table>
重点——单元格与单元格之间的距离cellspacing,单元格内文字与单元格边框距离cellpadding

公式:cellspacing="单元格之间的间距" cellpadding=“单元格内的文字与单元格边框的距离”
<table border="1" width="300px" height="300px" cellpadding="30px" cellspacing="20px">
 <tr>
        <td width="60px" height="60px">数学</td>
        <td>语文</td>
    </tr>
    <tr>
        <td>英语</td>
        <td>体育</td>
    </tr>
</table>

转载于:https://www.cnblogs.com/a199706/p/11024021.html

猜你喜欢

转载自blog.csdn.net/weixin_34342905/article/details/92846189
今日推荐