好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

HTML表格与列表_html/css_WEB-ITnose

HTML表格

表格其实就是很多的小单元格,而这些小单元格很有次序的排列着,它们有很多行,很多列。这些很多行列组成的东西,就叫表格,表格是 标签来定义的。而 标签中的行就是 标签,而列就是 标签,必须先定义行才能定义列。因为html中,每一列是在一行当中的。

下表总结了一些常用的标签:

表格 描述 定义表格 定义表格标题 定义表格的表头 定义表格的行 定义表格的单元 定义表格的页眉 定义表格的主体 定义表格的页脚 定义表格的列属性

先定义一个简单的表:

运行后可以看到

                                                                           水果                  水果                  水果                                                 asd                  asd                  asd                  asd                              

可以看到,上面注释下面的 与 反正写了。会出现一个很细小的表格,但是 中写的文字,是不会显示上去的

所以html中,编写表格是要一行一行的写。 标签中包含

没有边框的表格

没有边框的表格,其实就是在 标签中,不加属性border。border这个属性是代表表格的边框。如果不加属性的话,默认border="0" ,但是没有边框有的时候你就看不出来它是一张表格了。所以有的时候会给border="1px"设置1像素的边框。暂时去掉border属性,完成一张没有边框的表格

                                                                           呵呵                  哈哈                  嘻嘻                                            嘿嘿                  嘎嘎                  噗噗                                            啊啊                  哦哦                  噢噢                              


表格中的表头 我是表头

还可以给表添加表头,使用 标签, 标签也是在 标签中的,我们为了好看,还是把border加上:

                                                                           人物                  介绍                  产品                                            史蒂夫·保罗·乔布斯                  苹果CEO                  Apple系列                                            丹尼斯·里奇                  C语言之父                  C语言                                            比尔·盖茨                  微软CEO                  Windows系统                              

还可以设置表格内的边距 cellpadding 属性
也可以设置单元格边距 cellspacing 属性

               xxx        


带有标题的表格

              xxx表                               xxx                

表格内的颜色bgcolor属性

               xxx        


单元格内容排列 align 属性分别有center、left、right

      xxx表               xxx        

跨行和跨列的单元格 colspan属性,准确的来说,就是合并单元格

      xxx表               xxx          xxx                    xxx          xxx          xxx        

HTML列表

列表就是像word里面的标题一样,顺着往下数的标题。

下标是一些控制标题的标签

标签 描述 有序列表 无序列表 列表项 列表 列表项 描述

这些列表还分有序列表,无序列表和自定义列表。

无序列表

属性:disc:实体圆、circle:空心圆、square:实体方块

                                                               我是第一个              我是第二个              我是第三个                                     我是第一个              我是第二个              我是第三个                                     我是第一个              我是第二个              我是第三个                 

有序列表

属性:A、a、l、i、start

                                                               我是第一个              我是第二个              我是第三个                                     我是第一个              我是第二个              我是第三个                                     我是第一个              我是第二个              我是第三个                                     我是第一个              我是第二个              我是第三个                                     我是第一个              我是第二个              我是第三个                                     我是第一个              我是第二个              我是第三个                 

嵌套列表

、 、

嵌套列表就是有序列表套无序列表,无序套有序的呗。

                                                          人物                               斯蒂芬·保罗·乔布斯                  丹尼斯·里奇                  比尔·盖茨                                       动物                               猫                  狗                  熊                                          

自定义列表

、 、

自定义的列表,就是没有有序、无序的点。后期可以用CSS样式来加工修改。也是比较常用的操作

                                                          我是标题                               我是正文,我必须长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长                                          

查看更多关于HTML表格与列表_html/css_WEB-ITnose的详细内容...

  阅读:29次