HTML下拉列表 textarea fieldset及表格的运用

表单

1.1下拉列表

使用下拉列表的好处:

(1)节省页面空间,使得页面更加简洁;

(2)方便输入;

(3)规范输入。

    你来自:

    

    提交"/>

标签的name属性定义了提交的参数名

 

提交的参数如下:

 

多选可通过设置multiple属性来实现,Ctrl+点击选择多个。

你喜欢的颜色有:

    

 

传递的参数为:

 

        国产车">

            ">红旗

            

            ">奇瑞

        

        德系车">

            

            

            

        

        日系车" disabled>

            ">丰田

            ">本田

            ">三菱

        

的label属性定义了分组显示的文字,disable设置该分组不能用。

selected属性设置默认的选项。


1.2textarea


1.3fieldset

fieldset标签是对表单进行分组,可以形成子表单,产生一个边框,与legend标签配合使用,legend可以设置fieldset的标题,默认在左上方。

disabled属性禁用fieldset,fieldset内部的所有表单控件都将不可用;

form属性指定fieldset所属的表单;

name属性为fieldset名称。

legend标签有一个align属性,指定标题的位置,可取值top、left、right、bottom(HTML4.01不赞成使用,效果也不大好,right有效,默认是left)。

    

        健康信息

        身高:

        体重:

    

1.4表单总结

表单控件比较多,input标签提供的就有文本框、单选框、复选框、密码框、提交按钮、重置按钮和普通按钮,此外还有一个隐藏域和文件按钮。此外,还有下拉列表、textarea多行文本和对表单进行分组的fieldset。

表格

2.1表格

表格的组成部分:标题、表头、主题、表尾

定义一个表格

定义表头部分

定义表格主体(数据)部分

定义表尾,一般显示汇总信息等。

定义一行

定义表格的标题

定义一个数据项(单元格),一般用于表头,有加粗样式,一般用于表格主体部分,没有加粗样式。

的rowspan和colspan分别定义单元格跨行的行数 、跨列的列数。

table标签的cellpadding属性指定单元边沿与其内容的空白,border属性规定表格边框的宽度,cellspacing属性指定单元格之间的空白。

Month Savings
January $100

2.2table布局

布局:是一个页面的整体结构

结构特点:从上到下,从左往右。一般每一行的高度是一致的。

页面的布局可以通过table来实现,一个单元格就是一个布局区域单位。该区域的大小可以通过height和width属性来设置,位置是通过单元格的相对位置来体现的。

同时可以结合rowspan和colspan两个属性来完成单元格的合并。

当布局较为复杂时,可以使用table的嵌套来实现,即在某个单元格中再嵌入一个table进行划分。

table布局用得比较少,一般用于比较规整的网页,早期的网页是用table布局的,但它存在一定的缺陷,table的嵌套会增加浏览器的解析时间,也就是加载比较慢。

        

            

        

        

            

        

        

            

            

        

        

            

            

            

        

    

                

                    

                        

                        

                        

                        

                        

                        

                        

                        

                    

                

首页 学院概况 机构设置 新闻公告 教学科研 招生就业 数字校园

            

div

标签定义了一个分块(division)

3.1写法

显示特点:在新的一行进行显示。块级标签。一般与css配合使用进行页面布局。

标签总结

块级标签:在新的一行进行显示

div、h1-h6、p、hr、li、table、ul、ol、dl、dt、dd、tr、option、catption、optgroup、thead、tbody、tfoot...

内联标签:跟块级标签相反,不会新起一行显示

img、input、a、tdtextarea、span、labelselect、thbutton...

内联标签一般不能嵌套块级标签。

你可能感兴趣的:(HTML下拉列表 textarea fieldset及表格的运用)