html day02

最新推荐文章于 2024-07-25 11:26:35 发布

谁的青春不是梦

最新推荐文章于 2024-07-25 11:26:35 发布

阅读量66

点赞数

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/weixin_53515338/article/details/115494774

版权

html 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

HTML的表格

           表格 ：table标签  行：tr 表示行
                                        列：
                                        格子：td 表示列
           
               <html>
                                  <head> 
                                                   <title>表格</title>
                                   <body>
                                    <table     aligm = "center"  border = "1px"    width = "300px" height = "150px">   
                                    整个表格居中
                                    设置边框为一像素宽度
                                    width设置整体像素
                                    除了写像素以外还可以设置百分比边框
                                    还可以设置高度
                                    px 表示像素	
                                    设置居中：在表格里设置，用center
                                    
                                                 <tr>
                                                 	   <td> a</td>          单格子里面的放的东西
                                                 	   <td> b</td>
                                                 	   <td> v</td>
                                                 </tr>
                                                    <tr>
                                                 	   <td> x</td>
                                                 	   <td> y</td>
                                                 	   <td> z</td>         
                                                 </tr>
                                                ....省略不写
                                    </table>
                                   </body>
                                  </head>
                </html> 
                
                              行中包含了列

##单元格合并

         <html>
                                  <head> 
                                                   <title>表格</title>
                                   <body>
                                                 <tr>
                                                 	   <td> a</td>          单格子里面的放的东西
                                                 	   <td> b</td>
                                                 	   <td> v</td>
                                                 </tr>
                                                    <tr>
                                                 	   <td> x</td>
                                                 	   <td> y</td>
                                                 	   <td> z</td>         
                                                 </tr>
                                   </body>
                                  </head>
                </html>

如何合并：
–找到需要合并的格子
–点击删除格子，在到这个格子（td）用属性 rowspan（rowspan = “合并几个就写几个”）
注意：半角符号的双引号不要丢下
–rowspan是上下格子（列）合并
–左右（行）格子合并：
* colspan
* 步骤和上下合并一样
注意：
– rowspan合并的时候，是删除下面的单元格（有两种含义）
– colspan合并的时候没有要求

th标签

         	th标签的特点：
         	                      剧中、加粗      
         	                      th标签是一个单元格标签

thead、tbody、tfoot标签

                     <html>
                                  <head> 
                                                   <title>表格</title>
                                   <body>
                                            <thead>
                                                 <tr>
                                                 	   <td> a</td>          单格子里面的放的东西
                                                 	   <td> b</td>
                                                 	   <td> v</td>
                                                  </tr>
                                             </thead>
                                                   
                                             <tbody>
                                                               <tr>
                                                                 	   <td> x</td>
                                                                	   <td> y</td>
                                                                	   <td> z</td>         
                                                        </tr>
                                             </tbody> 
                                   </body>
                                  </head>
                </html>