html表格铺满页面.docx
《html表格铺满页面.docx》由会员分享,可在线阅读,更多相关《html表格铺满页面.docx(5页珍藏版)》请在冰豆网上搜索。
html表格铺满页面
竭诚为您提供优质文档/双击可除
html表格铺满页面
篇一:
html创建网页表格的基本原则和方法
html创建网页表格的基本原则和方法
将一定的内容按特定的行、列规则进行排列就构成了表格。
无论在日常生活和工作中,还是在网页设计中,表格通常都可以使信息更容易理解。
html具有很强的表格功能,使用户可以方便地创建出各种规格的表格,并能对表格进行特定的修饰,从而使网页更加生动活泼。
html表格模型使用户可以将各种数据(包括文本、预格式化文本、图像、链接、表单、表单域以及其他表格等)排成行和列,从而获得特定的表格效果。
表格在网页设计中的地位非常重要,可以说如果您表格用不好的话,就不可能设计出出色的网页。
大多数初学者一开始就接触表格,对表格都有一定的了解,但是要实现真正细致甚至强大的功能,仔细理解table的代码结构至关重要!
我们将在这里详细介绍表格各种常用的标记、技巧以及表格使用中的问题,了解和掌握了这些内容,你将发现,table原来是这样的亲切易用!
一、创建基本的表格
一个表由<table>开始,</table>结束,表的内容由<tr>,<th>和<td>定义。
<tr>说明表的一个行,表有多少行就有多少个<tr>;<th>说明表的列数和相应栏目的名称,有多少个栏就有多少个<th>;<td>则填充由<tr>和<th>组成的表格。
表格重要的基本标记不多,但每个标记都有很多的属性,考虑到一下子把这些属性都列出来,可能让初学者感到无从下手,所以我们还是从表格的外观
(即浏览器中显示的表格的样式)来了解最基本的属性。
在讲解之前,我们先来看看表格的基本构造。
下图是一个3行3列的表格。
这里面有两个概念要弄明白:
表格与单元格。
他们的关系是整体与局部的关系,如同砌墙的砖和砌好的墙一样。
在上面3行3列的表格中一共有9个单元格。
由于我们后面将提到的表格属性和单元格属性有很多是相同的,所以一定要分清楚。
前面已经说过表格的最基本标记为<table>、<tr>、<td>,可以先树立这样一个概念:
描述整个表格的属性标记放在<table>里,描述单元格的属性标记放在<tr>、<td>里。
有这样一个概念后,我们学习起来就可能简单些。
1、表格、单元格的大小,表格边框的宽度、颜色,单元格边框的颜色
表格以及单元格的大小是用“width=#”和“height=#”属性说明,“width=#”表示宽,“height=#”表示高,,#是以象素或者百分比为单位的数字。
表格边框的宽度是用“border=#”属性说明,,#为宽度值,单位是象素,表格边框的颜色是用“bordercolor="#"
html表格—1—
篇二:
解读:
html中表格的优缺点
解读:
html中表格的优缺点
我们知道,互联网发展到几天,html已经进入现在的html5时代,虽然现在html5还没有正式成为规范,但是很多大公司已经在开始使用,而css的诞生,也使得页面的布局由原来的table布局,走向了现在的div+css的布局。
那论其优缺点,笔者认为布局没有好坏,只要适不适合!
进来,很多人在问我,现在大多数布局都采用div了,表格是不是可以不要了,答案当然是不可以了。
下面我们来看看表格为什么也有它自身的优势,没有完全被替代。
我们知道,表格布局,内容不被搜索引擎喜欢,换言之:
使用table布局,搜索引擎抓取页面的信息不好,即是优化不好,那做网络营销的人肯定问题就来了,既然不好,那就不要了?
!
下面我们还是来看看表格的优缺点,先从缺点看,在从优点看!
table布局的缺点:
1、标签结构多,复杂
我们可以从表格的结构来看:
内容1
从上面表格的结构标签来看,标签的对数较多,在表格布局中,主要是用到表格的相互嵌套使用,这样就会造成代码的复杂度更高!
2、表格布局,不利于搜索引擎抓取信息,直接影响到网站的排名。
以上也就是表格最主要的两个缺点,下面我们在来看看表格布局的优点。
table布局的优点:
1、表格布局,使得结构位置更简单
2、对于没有学习css的人来说,只能选择table
3、对于学习的初期,table更容易理解
4、数据化的存放更合理。
例如,学生信息这样的表,如果要在网页中显示,表格布局反而会更简单,相反利用div+css会使得事情更加复杂化!
从上述优缺点来看,table不是不可以被替代,但是,table在存放页面数据化的表格信息时,会使得我们开发起来更加容易,节省很多时间。
综上,表格和div+css布局各有优缺点,并不应该完全舍弃,我们应当结合实际情况,确定在什么情况使用什么标签更合适,选择合适的标签这样才是一个好的页面布局!
篇三:
htmltable布局
第一章html基本知识
1.1
html是超链接标签语言或超文本标记语言,它是以标签来描述文件中的多媒体信息。
1.2
html文件结构(由标题、段落、表格和文本等各种嵌入的对象构成。
)
网页头部信息
1.3
html可由记事本和网页编写软件编写,如dreamweaver。
1.4
html页面主体标签的属性
网页背景色(bgcolor);
。
网页背景图片(background);
。
文本颜色(text)。
。
链接文本颜色属性(link);
。
网页内容的边距设置(margin);
。
第二章html网页中的文字段落和列表
2.1
插入特殊字符
空格符(li>列表项(内容)
符号类型:
disc●circle〇square■
2、定义列表
(dl全称:
definitionlist;dt:
definitionterm;dd:
definitiondescrjiption)
名词
解释
……
3、菜单列表
列表项(内容)
列表项(内容)
列表项(内容)
目录列表
列表项(内容)
列表项(内容)
列表项(内容)
有序列表
(序列类型:
1:
数字1、2、3……a:
小写英文字母a、b、c……
a、b、c……i:
小写罗马数字……i:
大写罗马数字……)
(起始值start;)
列表项(内容)
列表项(内容)
列表项(内容)
a:
大写英文字母
第三章图片及多媒体文件的使用
3.1
图像标签
属性:
height(图像高度)、width(图像宽度)、border(图像边框宽度)、hspace(水平边距)vspace(垂直边距)、align(对齐方式)、alt(图片未显示时的提示文字内容)
背景音乐
属性:
loop(播放次数)
插入多媒体
属性:
width(播放界面宽度)、height(播放界面高度)、loop(播放次数)、autostart(自动运行)
滚动效果
属性:
direction=”up、down、left、right”(滚动方向)、behavior=”scroll(循环滚动)、slide(滚动一次)、alternate(来回交替滚动)”(滚动方式)loop(滚动次数)scrollamount(滚动速度)scrolldelay(滚动延迟)bgcolor(滚动背景颜色)widthheight(滚动背景面积)hspacevspace(设置背景空间)
第四章html超链接和表单
4.1
超链接的基本概念
主要有三个部分组成
1、位置点标签将文本或图像标识为链接。
2、属性href=””,放在位置点起始标签中。
3、地址(称为uRl)浏览器要链接的文件。
这些链接可以指向某个html文档,也可指
向其他的元素,如图形、脚本和其他文件。
4.2
超链接标签
属性:
href(指定链接地址)name(给链接命名)title(给链接添加提示文字)target(指定链接的目标窗口)
target属性取值self(在当前页面打开)top(在顶层框架打开)blank(在一个空白窗口打开)parent(在当前框架的上一层里打开链接)
4.3
图像超链接
链接的图像
图像热区的链接
热区形状包括:
rect(矩形区域)circle(圆形区域)poly(多边)
4.4
创建锚点链接
创建锚点
文字内容
链接锚点
链接内容
4.5
插入表单
表单的处理程序(action)、传送方法(method)和提交方式(post、get)。