`

HTML基础1

    博客分类：
  • css
 
阅读更多

表格布局基本不再使用，但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>

 

分享到：
| 2进制，10进制，16进制
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    day01html基础1总结.xmind

    day01html基础1总结.xmind

    python 零基础学习篇web前端开发基础Html基础1 html的介绍 .mp4

    python 零基础学习篇

    学习html基础.zip

    学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习html基础学习html基础学习html基础学习html基础 学习html基础学习...

    HTML基础学习.zip

    HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML基础学习HTML基础学习HTML基础学习HTML基础学习 HTML...

    HTML基础知识点汇总

    HTML 基础知识点汇总 HTML（Hypertext Markup Language，超文本标记语言）是网页设计的基础语言，它将影像、声音、图片、文字等连接显示出来。HTML 语言使用标记式的指令（Tag），将网页文件组织起来，并由浏览器...

    HTML基础.ppt

    HTML基础 教大家了解学习HTML的课件

    HTML5基础入门全套视频课程.rar

    HTML5是构建Web内容的一种语言描述方式。...HTML5在从前HTML4.01的基础上进行了一定的改进，虽然技术人员在开发过程中可能不会将这些新技术投入应用，但是对于该种技术的新特性，网站开发技术人员是必须要有所了解的。

    HTML基础.xmind

    HTML基础.xmind

    html基础教程学习

    html基础教程学习

    html基础ppt

    html基础

    HTML5Canvas基础教程

    资源名称：HTML5 Canvas基础教程内容简介：《HTML5 Canvas基础教程》从HTML5和Javaｓｃｒｉｐｔ(以及jQuery)的基础知识讲起，全面介绍了HTML5 Canvas的各种特性，包括渲染上下文、坐标系统、绘制图形、保存和恢复...

    html的基础学习.zip

    html的基础学习html的基础学习html的基础学习html的基础学习 html的基础学习html的基础学习html的基础学习html的基础学习 html的基础学习html的基础学习html的基础学习html的基础学习 html的基础学习html的基础学习...

    HTML5基础知识核心技术与前沿案例

    资源名称：HTML5基础知识 核心技术与前沿案例内容简介：HTML5基础知识 核心技术与前沿案例《HTML5基础知识、核心技术与前沿案例 》是一本引导初、中级学习者深入了解并有效掌握HTML5核心技巧的技术实战书籍，全书...

    尚硅谷前端入门html+css零基础教程，零基础前端开发html5+css3视频尚品汇项目源码

    1. HTML基础知识：了解HTML的基本结构，如何创建元素，以及如何组织网页内容。 2. HTML5新特性：掌握新的HTML5元素，以及如何利用它们来增强网页的功能和用户体验。 3. CSS样式规则：学习选择器、属性和值，学会控制...

    HTML基础学习示例代码.zip

    HTML基础学习示例代码HTML基础学习示例代码HTML基础学习示例代码 HTML基础学习示例代码HTML基础学习示例代码HTML基础学习示例代码 HTML基础学习示例代码HTML基础学习示例代码HTML基础学习示例代码 HTML基础学习示例...

    html基础ppt下载

    掌握HTML基础知识是创建静态网页的第一步，随着技能的提升，你还可以学习CSS（Cascading Style Sheets）来控制网页的样式，以及JavaScript和服务器端技术来实现更复杂的交互功能。通过不断实践和学习，你可以成为一...

    HTML语言基础PPT

    HTML 语言基础！网页设计与Web开发基础！HTML文档基本结构 HTML常用标签！

Magicbox
Global site tag (gtag.js) - Google Analytics