表格布局基本不再使用,但DIV+CSS布局的很多知识跟表格布局类似,所以这里还是复习下。把代码贴出来。
<html> <head> </head> <body> <center> <ol start="3"> <li>细线表格:用背景色来当成表格线,表框设为0</li> <table width="600" bgcolor="black" cellspacing="1" cellpadding="5"> <tr bgcolor="white"> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr bgcolor="white"> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr bgcolor="white"> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> <br/> <br/> <li>基本表格</li> <table width="600" border="1" bordercolor="black" cellspacing="0" cellpadding="5"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> <br/> <br/> <li>默认表格</li> <table width="600" cellpadding="5"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> <br/> <br/> <li>双线表格</li> <table width="600" border="1" bordercolor="black" cellpadding="5"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> <br/> <br/> <li>合并单元格1</li> <table width="600" border="1" bordercolor="black" cellpadding="5"> <tr> <td>1.1</td> <td colspan="2">1.2</td> </tr> <tr> <td>2.1</td> <td rowspan="2">2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.3</td> </tr> </table> <br/> <br/> <li>合并单元格2</li> <table width="600" border="1" bordercolor="black" cellpadding="5"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td colspan="2">2.1</td> <td rowspan="2">2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> </tr> </table> <br/> <br/> <li>凸起表格(bordercolorlight下右属性和bordercolordark上左属性)</li> <table width="600" border="1" cellpadding="5" bordercolor="blue" bgcolor="gray"> <tr> <td bordercolorlight="black" bordercolordark="white">1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> <br/> <br/> <li>有表格边框,无单元格边框(table的frame和rules属性)</li> <table width="600" cellpadding="5" border="3" bordercolor="#9ED18E" rules="none" cellspacing="0"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> <br/> <br/> </ol> </center> </body> </html>
相关推荐
day01html基础1总结.xmind
html编程简介HTML(Hyper Text Markup Language 超文本标识语言) 是一种用来制作超文本文档的简单标记语言。 用HTML编写的超文本文档称为HTML文档。
HTML基础1
python 零基础学习篇
html基础html基础html基础html基础html基础html基础html基础html基础
HTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdfHTML基础.pdf
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 0 Strict//EN" " http://www w3 org/TR/xhtml1/DTD/xhtml1-strict dtd ">代表文档类型,大致的意思就是:遵循严格的XHTML1的格式书写 具体文档类型后面有介绍(见文档类型),...
学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习...
HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML...
HTML基础 教大家了解学习HTML的课件
HTML5是构建Web内容的一种语言描述方式。...HTML5在从前HTML4.01的基础上进行了一定的改进,虽然技术人员在开发过程中可能不会将这些新技术投入应用,但是对于该种技术的新特性,网站开发技术人员是必须要有所了解的。
HTML基础.xmind
HTML 基础知识笔记HTML 基础知识笔记HTML 基础知识笔记HTML 基础知识笔记
html基础加强html基础加强html基础加强html基础加强html基础加强html基础加强
HTML基础 HTML基础 HTML基础 HTML基础 HTML基础
html基础教程,html基础教程 HTML基础,html基础教程 HTML基础,适合初学者借鉴学习。学习HTML。
资源名称:HTML5 Canvas基础教程内容简介:《HTML5 Canvas基础教程》从HTML5和Javascript(以及jQuery)的基础知识讲起,全面介绍了HTML5 Canvas的各种特性,包括渲染上下文、坐标系统、绘制图形、保存和恢复...
html的基础学习html的基础学习html的基础学习html的基础学习 html的基础学习html的基础学习html的基础学习html的基础学习 html的基础学习html的基础学习html的基础学习html的基础学习 html的基础学习html的基础学习...
HTML基础 ppt
资源名称:HTML5基础知识 核心技术与前沿案例内容简介:HTML5基础知识 核心技术与前沿案例《HTML5基础知识、核心技术与前沿案例 》是一本引导初、中级学习者深入了解并有效掌握HTML5核心技巧的技术实战书籍,全书...