mysileng

常用链接

统计

最新评论

2009年7月21日 #

第三课时 HTML表单和框架

第三课时 HTML表单和框架

一、<form>表单

1.定义:用来收集用户信息,提供服务

2.表单的简单框架:

    <form>

       <input>

       <select>…</select>

       <textarea>…</textarea>

    </form>

3.<form>标记的主要属性:

    a.action:指出该表单所对应的处理程序的位置(url

    b.method:指出表单信息的提交方式:get(默认)post

                     get:提交总信息不超过2K,且提交后可以在地址栏中看到

                     post:提交信息长度不限,且不会显示在地址栏中

    c.enctype:表单数据的编码方式:

              application/x-www-form-urlencoded(默认):键值对编码

              multipart/form-data:二进制流编码(用于传输文件)

    d.target:类似超链接中的target

二、<form>中的<input>标记

       <form>有三个输入子标记,用于收集用户信息。<input>是应用最为广泛的。

    1.<input>的主要属性:

        a.Type:指定输入比较的输入方式:(共10中方式)

              text:单行文本框

              password:密码文本框

              hidden:隐藏文本框

file:文件选择框

checkbox:复选框

              radio:单选框

              -----------------

              Button:普通按钮(要添加脚本才有动作,否则不做任何事情)

              Submit:提交按钮(提交<from>标签内的所有信息)

              Reset:重置按钮

              Image:图片按钮(功能同提交按钮)

             

    b.size:文本框的长度

    c.maxlength:文本框允许输入的最大长度(控制输入长度的最简单办法)

    d.value:当type为文本类型时,value代表初始值和提交值

                   type为按钮类型时,value为按钮的显示文本(因为按钮不需要提交值)

    e.checked(标示属性):使用在type=”checkedbox|radio”时,表示被选中状态

          注:使用radio时,name的值要一直,否则达不到一组的效果。

三、<form>中的其他标记

1.<select>:下拉列表选择标记

    <select size=”” multiple>

       <option selected value=””>…选项内容…</option>下拉选项

    </select>

            Size:下拉列表显示的项数。

            Multiple(标识属性):开启多选功能

            Selected(标识属性):表示被选中的状态

            Value:表示这个下拉选项的提交值

2.<textarea>多行文本标记:

    <textarea rows=”” cols=””>…</textarea>

3.filedSet分组标记:

    <filedset>
        <legend>...</legend>

        …可以把不同的标记用框框分组显示

    </filedset>

    Legend:表示框框标题名字。

四、<form>中所有标记都有的属性

1.name:名字,常用于调用时的参数

2.ID:同name

3.title:提示信息

4.tabIndex:定义tab键的反问顺序

5.Accesskey:定义ALT+“”的快捷访问键

五、框架

1.定义:可以把一个浏览器窗口分成若干独立的子窗口,字窗口相互独立的滚动刷新,可以有所联系,

2.简单使用:

    <html>

       <head>…</head>

       <frameset cols=”30%,*”>

              <frame src=””>

<frame src=””>

       </frameset>

    </html>

    用<frameset>标记代替<body>,若把<frameset>标记放在<body>内,<frameset>将不起作用。

3.<frameset>的主要属性:

    a.cols:纵向分割,cols=”像素|百分比|*”三种方式:

              像素:为单个像素占总像素的比例

              百分比:直接算整个区域的百分比

*:若只出现一个*,代表窗口剩余部分;若出现多个*,就所有*号按比例分窗口剩余部分。

    b.rows:横向分割(使用同纵向)

    c.border:分割线宽度

    d.bordercolor:分割线颜色

    e.frameborder:设置是否隐藏分割线,为YES是显示,NO为隐藏

3.<frameset>中使用的标记:

    a.<frame>子窗口标记:

        <frame src=”” name=”” noresize scrolling=”no|yes” marginwidth=”” >

        Src:子窗口路径     name:子窗口名字

        Noresize(标识属性):不允许改变分割线位置

        Scrolling:定义是否需要滚动条

        Marginwidth:文本与分割线的宽度

        Marginheight:文本与分割线的高度

    b.<iframe>内联窗口标记(浮动窗口标记)

    与<frame>的不同:

                     <iframe>必须放在<body>,<frame>不需要。

                     <frame>必须嵌在<frameset>中,而<iframe>不需要。

                     <iframe>可以自定义高宽度,而<frame>是通过<frameset>定义的。

posted @ 2009-07-21 14:44 鑫龙 阅读(541) | 评论 (0)编辑 收藏

第二课时 HTML超连接和表格

第二课时 HTML超连接和表格

一、<a>…</a>超链接标记

    <a href=”” name=”” target=””>…</a>

    1.主要属性:

        a.href:表示要链接的位置,这里又分为三种表示形式:

           第一种:内链接

                     Href=”#name(热点名)

           第二种:外链接

                     Href=”URL”

           第三种:邮箱链接

                     Href=mailto=...@...;cc=...&bcc=...&subject=...&body=...

                     Cc为抄送,bcc为密送,subject为主题,body为内容

    b.name:常用于内部链接的热点名

                     <a name=”…”></a>

    c.target:定义打开新链接的窗口形式:

           值分为两种形式:填写预定义的值和非预定义的值

           预定义:_self_blank_parent_top

                         _self:在当前窗口打开链接

                         _blank:在新窗口打开链接

                         _parent:在父窗口中打开链接

                         _top:在顶层窗口中打开链接

注:_parent中的父子关系,用于<frameset>标记中,但真正的父子关系是指文件中的父子关系,而不是逻辑上的父子关系。

  非预定义:填写你想打开窗口的名字(去掉html,若填写的名字文件不存在,则在新窗口中打开。

二、<table>…</table>表格标记

1.表格框架介绍

    <table>

           <caption>…</caption>表主题标记

           <tr>表行标记

                  <th>..</th>表头单元格标记

    <th>..</th>

    …

           </tr>

           <tr>

                  <td>..</td>普通单元格标记

    <td>..</td>

    …

           </tr>

    </table>
2.
表格主要属性:

    a.border:边框粗细(像素)    b.bordercolor:边框颜色

    c.width:表格宽度                        d.height:表格高度

    e.cellpadding:单元格中文字与框线的间隙大小(像素)

    f.cellspacing:框线的粗细(像素)
3. <table>
中的主要标记

    a.<caption>…</caption>表格主题标记:若要设置则必须放在<table>,<tr>

    b.<tr>…</tr>表格行标记:用来定义表格中的一行内容,<th><td>都置于其中。

    c.<th>..</th>/<td>…</td>单元格标记:

        <th><td>唯一不同:<th>的文字有粗体的效果

       主要属性:

              Colspan:跨几列   rowspan:跨几行

              Valign:垂直对齐方式 align:水平对齐方式

三、多媒体标记

1.插入背景音乐

  <bgsound src=” URL” loop=””>

2.插入视频或音频:

    <embed src=” URL” autostart=”true|false”>

    Autostart:是否自动播放

posted @ 2009-07-21 14:39 鑫龙 阅读(472) | 评论 (0)编辑 收藏