立即注册 登录
心灵家园 返回首页

丑了点的个人空间 http://heartxin.com/?15682 [收藏] [复制] [分享] [RSS]

日志

【边框的属性】HTML基本语法

已有 311 次阅读2015-5-10 21:15

 

1:边框的基格式:

<TABLE cellSpacing=边框宽度 width="网页宽度" background=第一层边框图片网址>

<TBODY>

<TR>

<TD>

<TABLE cellSpacing=1 borderColorDark=#0d1737 cellPadding=边框宽度 width="网页宽度" borderColorLight=#24387a background=第二层边框图片网址 border=1>

<TBODY>

<TR>

<TD>

<TABLE cellPadding=边框宽度 width="网页宽度"background=第三层边框图片网址>

<TBODY>

<TR>

<TD>

<TABLE width="网页宽度" background=背景图片网址 border=0>

<TBODY>

<TR>

<TD>

说明:

    <table>:表格的起始符。任意一个表格的开始都必须以它开头,且必须有终止符</table>。

    cellspacing:单元格间距。当一个表格有多个单元格时,各单元格的距离就是cellspacing了,如若表格只有一个单元格,那么,这个单元格与表格上、下、左、右边边框的距离也是cellspacing。

    width:表格的宽度。取值从0开始,默认以像素为单位,与显示器的分辨率的像素是一致的。800×600的显示分辨率下,如果表格设置成1000个像素的宽度,那么,得出的效果将导致IE的横向滚动条出现,只有通过滑动它才能看到表格最右边的内容,所以建议在设置表格的宽度时充分考虑显示分辨率问题。width的取值还可以使用百分比,如widht="100%",这种赋值法有个好处:表格的宽度将根据可显示的宽度来自我调整宽度。

    background:表格的背景图。其值为一个有效的图片地址。<td>也有此属性。同时设置背景色和背景图不冲突,也建议这么做,这样,当图片不能显示时,表格的外观依然是好看的。

    <tbody>:表体的起始符。紧跟在<table>之后,表示表体开始。必须有结尾符,放在</table>之前。在纯网页中可以不要tbody元素,但在论坛一定要使用,否则,当帖子用到较多的表格时,论坛的自动填充功能将可能会导致代码出错。

    <tr>:tr的作用是规定表格的行,其中,t是table,r是row(行)。有多少组tr,这张表格就有多少行。<tr>紧跟在<tbody>之后。必须有终止符</tr>。

    <td>:td的作用是规定表格的列,t是table,d可理解为down(向下)。有多少组td,这张表格就有多少列。第一个<td>紧跟在<tr>之后。终止符为</td>。td与tr配合构成单元格。

以上就第一层边框的基本要素,现在我们在看看第二层边框:

<TABLE cellSpacing=0 borderColorDark=#0d1737 cellPadding=边框宽度 width="网页宽度" borderColorLight=#24387a background=第二层边框图片网址 border=1>

<TBODY>

<TR>

<TD>

其它的全和第一层一样,但多了这二组:

1:cellSpacing=1 borderColorDark=#0d1737 为暗边框,边框宽度为1象素,颜色为0d1737

2:    cellpadding:单元格衬距。指该单元格里的内容与cellspacing区域的距离,如果cellspacing为0,则表示单元格里的内容与表格周边边框的距离。

3:borderColorLight=#24387a 为亮边框,颜色为0d1737

第三层边框和第一层一样,现在我们来看最后一层边框也就是背景。

<TABLE width="网页宽度" background=背景图片网址 border=0>

<TBODY>

<TR>

<TD>

它只有背景的宽度width="网页宽度",背景展示的网址:background=背景图片网址,还多了一个border=0它是什么意思呢?

border:此属性定义表格的边框。比如,border=1,表示表格边框的粗细为1个像素(默认值),为0表示没有边框。

以上就是边框的基本结构,现在我们来看一个实例:看看它的效果:

例:

<TABLE cellSpacing=38 width="100%" background=http://wz.2000y.net/uploadpic/2005043018225680611.jpg>

<TBODY>

<TR>

<TD>

<TABLE cellSpacing=0 borderColorDark=#0d1737 cellPadding=12 width="100%" borderColorLight=#24387a background=http://www.coolhot.cn/680/hongxiu/yaoyaosucai/chaguan/075.files/fdoluz2.jpg border=1>

<TBODY>

<TR>

<TD>

<TABLE cellPadding=5 width="100%" background=http://bbs.xxjy.net/UploadFile/2004-11/20041127135238480.jpg>

<TBODY>

<TR>

<TD>

<TABLE width="100%" background=http://www.ne.jp/asahi/syaraku/kichinyado/hana2/suiren/suiren22/suiren222.jpg border=0>

<TBODY>

<TR>

<TD>


路过

雷人

握手

鲜花

鸡蛋

全部作者的其他最新日志

发表评论 评论 (1 个评论)

回复 丑了点 2015-5-10 21:23
HTML基本语法




文件格式<html></html>(文件的开头与结尾)
主题<title></title>(放在文件的开头)
文头区段<head></head>(描述文件的信息)
内文区段<body></body>(放此文件的内容)
标题<h?></h>(?=1~6,改变标题字的大小)
标题对齐<h align=right,left,center></h>
字加大<big></big>
字变小<small></small>
粗体字<b></b>
斜体字<i></i>
底线字<u></u>
上标字<sup></sup>
下标字<sub></sub>
居中<center></center>
居左<left> </left>
居右<right> </right>
基本字体大小<basefont size>(取值范围从1到7,默认值为3)
改变字体大小<font size=?></font>(?=1~7)
字体颜色<font color=#rrggbb></font>(RGB色码)
指定字型<font face=?></font>(?=宋体,楷体等)
网址链结<a href="URL"></a>
设定锚点<a ></a>(?以容易记为原则)
链结到锚点<a href="#?"></a>(同一份文件)
<a href="URL#?"></A>(锚点不同文件)
显示图形<img src="URL"></a>
图形位置<img src="URL"
align=top,bottom,middle,left,right>(分别为上、下、中、左、右的位置)
图形取代文字<img src="URL"alt=?>(无法显示图形时用)
图形尺寸<img src="URL" width=? height=?>(?以像素为单位)
连结图形边线<img src="URL"border=?>(?以像素为单位)
图形四周留白<img src="URL"hspace=? vspace=?>(?以像素为单位)
段落<p></p>
断行<br></br>
横线<hr>
横线厚度<hr size=?>(?以像素为单位)
横线长度<hr width=?>(?以像素为单位)
横线长度<hr width=?%>(?与页宽相比较)
实横线<hr noshade>(无立体效果)
背景图案<body background=图形文件名>(图形文件格式为gif和jpg)
背景颜色<body bgcolor=#rrggbb>(RGB色码)
背景文字颜色<body text=#rrggbb>(RGB色码)
未链结点颜色<body link=#rrggbb>(RGB色码)
已链结点颜色<body vlink=#rrggbb>(RGB色码)
正在链结点颜色<body alink=#rrggbb(RGB色码)

facelist doodle 涂鸦板

您需要登录后才可以评论 登录 | 立即注册

小黑屋|手机版|Archiver|心灵家园 ( 粤ICP备2022134291号-1 )

GMT+8, 2024-5-21 03:52 , Processed in 0.027461 second(s), 18 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

返回顶部