RSS
热门关键字:  计算机有关资料  33252  mkv  word  MKV_NT
当前位置 : 主页>建站指南>div+css>列表

html语法

来源: 作者: 时间:2006-11-30 点击:
【表格栏距设定】

  1. 我们可以利用CELLPADDING属性自由设定表格内文距离格线的距离,这个属性很好用,保持适当的距离,看起来比较舒服。一般而言内定值为2,不过我建议设定为4比较漂亮。

    原始码 呈现结果
    <TABLE BORDER="1" CELLPADDING="10">
    <TR><TD>1</TD><TD>2</TD></TR>
    </TABLE>
    1 2

  2. 我们可以利用CELLSPACING属性设定表格栏位格线之间的距离。一般而言内定值为2,不过我通常习惯设为 0 。

    原始码 呈现结果
    <TABLE BORDER="1" CELLSPACING="5">
    <TR><TD>1</TD><TD>2</TD></TR>
    </TABLE>
    1 2

4.10 序列标签 <回细说索引>

【无序标签】

  1. 序列标签基本上可分为两种,一种是“无序条列”,一种是“有序条列”。所谓“无序条列”当然就是意指各条列间并无顺序关系,纯粹只是利用条列式方法来呈现资料而已,此种无序标签,在各条列前面均有一符号以示区隔。至于“有序条列”就是指各条列之间是有顺序的,从1、2、3…一直延伸下去。

  2. 我们先来看看“无序列表标签”如何使用:

    原始码 呈现结果
    <UL>
    <LI>姓名:杰克升
    <LI>生日:1974/11/21
    <LI>星座:天蝎座
    </UL>
    • 姓名:杰克升
    • 生日:1974/11/21
    • 星座:天蝎座

    其中<UL>标签即为“无序列表标签”,每增加一列内容,就必须加一个<LI>。

  3. 前面的符号一定是要圆形的吗?不,我们可以加入TYPE="形状名称"属性来改变其符号形状,一共有三个选择:DISK(实心圆)、SQUARE(小正方形)、CIRCLE(空心圆)三种(由于本页使用CSS故仅于Netscape看得出效果。)

    原始码 呈现结果
    <UL TYPE="CIRCLE">
    <LI>姓名:杰克升
    <LI>生日:1974/11/21
    <LI>星座:天蝎座
    </UL>
    • 姓名:杰克升凯
    • 生日:1974/11/21
    • 星座:天蝎座



【有序标签】

  1. 接下来,我们来看看“有序列表标签”如何使用:

    原始码 呈现结果
    <OL>
    <LI>姓名:杰克升
    <LI>生日:1974/11/21
    <LI>星座:天蝎座
    </OL>
    1. 姓名:杰克升
    2. 生日:1974/11/21
    3. 星座:天蝎座

    其中<OL>标签即为“有序列表标签”,每增加一列内容,就必须加一个<LI>。

  2. 和无序列表标签一样,我们也可以选择不同的符号来显示顺序,一样是用TYPE属性来作更改,一更有五种符号:1(数字)、A(大写英文字母)、a(小写英文字母)、I(大写罗马字母)、i(小写罗马字母)等五种:

    原始码 呈现结果
    <OL TYPE="A">
    <LI>姓名:杰克升
    <LI>生日:1974/11/21
    <LI>星座:天蝎座
    </OL>
    1. 姓名:杰克升
    2. 生日:1974/11/21
    3. 星座:天蝎座

  3. 另外,我们亦可指定序列起始的数目,其方法如下:

    原始码 呈现结果
    <OL START="8">
    <LI>姓名:杰克升
    <LI>生日:1974/11/21
    <LI>星座:天蝎座
    </OL>
    1. 姓名:杰克升
    2. 生日:1974/11/21
    3. 星座:天蝎座



【定义列表标签】

  1. 接下来我们要说明的这个标签,是“定义列表标签”也是属于序列标签之一。我们先来举个例子,我们常常会在文章中看见这样的格式:
    CSS(Cascading style sheet)
    CSS是由W3C于1996年12月所公布的一项新技术,什么叫做Cascading style sheet?简单说来他是一种具有阶层性的形式设定,能够让网页设计者在设计网页时,对于网页上的任何物件均有更佳的操控性…

    网页里也有可以做到这种效果的标签喔!现在要来跟各位说的就是这个标签。咱们先来看看这标签的用法:

  2. 我们先来看看“定义列表标签”如何使用:

    原始码 呈现结果
    <DL>
    <DT>小标题
    <DD>标题的内容说明
    </DL>
    小标题
    标题的内容说明

4.11 表单标签 <回细说索引>

【表单的用途】

对于一般的网页设计初学者而言,表单功能其实并不常用,因为表单通常必须配合着CGI、JAVA Script程式或是ASP程式来运作,不然表单单独存在的意义并不大。不过,一旦有机会将表单运用到网页中时,您的网页将摆脱单向呈现,而开始迈入和使用者互动的阶段喔!

本单元纯粹以介绍各式表单为主,至于一些CGI或ASP观念在此我就不提出了,因为提供零碎的观念,倒不如去看看专门介绍CGI的书籍来的妥当。

【各种输入类型】

  1. 文字输入列:每个表单之所以会有不同的类型,原因就在于TYPE="表单类型"设定的不同而已,我们就先来看看第一个类型:文字输入列。文字输入列的形态就是TYPE="TEXT,其使用方法如下:

    呈现结果
    姓名:
    原始码 <FORM>
    姓名:<INPUT TYPE="TEXT" NAME="NAME" SIZE="20">
    </FORM>

    其有下列可设定之属性:

    • NAME="名称",是设定此一栏位的名称,程式中常会用到。
    • SIZE="数值",是设定此一栏位显现的宽度。
    • VALUE="预设内容",是设定此一栏位的预设内容。
    • ALIGN="对齐方式",是设定此一栏位的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置中)、ABSBOTTOM(绝对置下)等。
    • MAXLENGTH="数值",是设定此一栏位可设定输入的最大长度。


  2. 单选核取表单:利用TYPE="RADIO"就会产生单选核取表单,单选核取表单通常是好几个选项一起摆出来供使用者点选,一次只能从中选一个,故为单选核取表单。

    呈现结果
    性别:男
    原始码 <FORM>
    性别:
    男 <INPUT TYPE="RADIO" NAME="SEX" VALUE="BOY">
    女 <INPUT TYPE="RADIO" NAME="SEX" VALUE="GIRL">
    </FORM>

    其有下列可设定之属性:

    • NAME="名称",是设定此一栏位的名称,程式中常会用到。
    • VALUE="内容",是设定此一栏位的内容、值或是意义。
    • ALIGN="对齐方式",是设定此一栏位的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置中)、ABSBOTTOM(绝对置下)等。
    • CHECKED,是设定此一栏位为预设选取值。


  3. 复选核取表单:利用TYPE=" CHECKBOX "就会产生复选核取表单,复选核取表单通常是好几个选项一起摆出来供使用者点选,一次可以同时选好几个,故为复选核取表单。

    呈现结果
    喜好: 电影 看书
    原始码 <FORM>
    喜好:
    <INPUT TYPE="CHECKBOX" NAME="SEX" VALUE="MOVIE">电影
    <INPUT TYPE="CHECKBOX" NAME="SEX" VALUE="BOOK">看书
    </FORM>

    其有下列可设定之属性:

    • NAME="名称",是设定此一栏位的名称,程式中常会用到。
    • VALUE="内容",是设定此一栏位的内容、值或是意义。
    • ALIGN="对齐方式",是设定此一栏位的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置中)、ABSBOTTOM(绝对置下)等。
    • CHECKED,是设定此一栏位为预设选取值。


  4. 密码表单:利用TYPE=" PASSWORD "就会产生一个密码表单,密码表单和文字输入表单长得几乎一样,差别就在于密码表单在输入时全部会以星号来取代输入的文字,以防他人偷窥。

    呈现结果
    请输入密码:
    原始码 <FORM>
    请输入密码:<INPUT TYPE="PASSWORD" NAME="INPUT">
    </FORM>

    其有下列可设定之属性:

    • NAME="名称",是设定此一栏位的名称,程式中常会用到。
    • SIZE="数值",是设定此一栏位显现的宽度。
    • VALUE="预设内容",是设定此一栏位的预设内容,不过呈现出来仍是星号。
    • ALIGN="对齐方式",是设定此一栏位的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置中)、ABSBOTTOM(绝对置下)等。
    • MAXLENGTH="数值",是设定此一栏位可设定输入的最大长度。


  5. 送出按钮:通常我们表单填完之后,都会有一个送出按钮以及清除重写的按钮,分别是利用TYPE=" SUBMIT "及TYPE=" RESET "来产生,相当的简单易用。

    呈现结果
    原始码 <FORM>
    <INPUT TYPE="SUBMIT" VALUE="送出资料">
    <INPUT TYPE="RESET" VALUE="重新填写">
    </FORM>

    其有下列可设定之属性:

    • NAME="名称",是设定此一按钮的名称。
    • VALUE="文字",是设定此一按钮上要呈现的文字,若是没有设定,浏览器也会自动替您加上“送出查询”、“重设”等字样。
    • ALIGN="对齐方式",是设定此一栏位的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置中)、ABSBOTTOM(绝对置下)等。


  6. 按钮元件:表单中或是JAVA SCRIPT常会用到按钮来作一些效果,因此,我们可以利用TYPE=" BUTTON "来产生一个按钮,相当简单。

    呈现结果
    请按下按钮:
    原始码 <FORM>
    请按下按钮:<INPUT TYPE="BUTTON" NAME="OK" VALUE="我同意">
    </FORM>

    其有下列可设定之属性:

    • NAME="名称",是设定此一按钮的名称。
    • VALUE="文字",是设定此一按钮上要呈现的文字。
    • ALIGN="对齐方式",是设定此一栏位的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置中)、ABSBOTTOM(绝对置下)等。
最新评论共有 0 位网友发表了评论
发表评论
评论内容:不能超过250字,需审核,请自觉遵守互联网相关政策法规。
用户名: 密码:
匿名?
注册