接上:

1.下拉列表框<option>,<selcct>

(1)解释:在表单中,通过option select标记可设计一个下拉式的列表或带有滚动条的列表,

   用户可以在列表中选中一个或者多个选项。

(2)基本语法:<select name="" size="" multiple>

      <option value="" selected>....</option>

      <option value="">...</option>

      ....

      </select>

(3)语法说明:    例如:<select size="4" name="list1" multiple="multiple">

<select>标记有:

    name:设定下拉列表名字;

    size:用于改变下拉框的大小,默认值为1;

    multiple:表示允许用户从列表中选择多项,若缺省,则表示单选;

这3个属性。

  option标记有:

    value:用于设置当该选项被选中并提交后,浏览器传送给服务器的数据;

    selected:用来指定选项的初始状态,表示该选项在初始时被选中;

这两个属性。

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

基本语法:

  <texearea name="" rows="" cols="" wrao="off|virtual|physical">

    初始值

    </textarea>

例如:<textara name="Letter" rows="4" cols="40"></textarea>

   <textarea name="userBasicInfo" rows="5" cols="50"></textarea>

end!

注意:rows设置输入域的行数, cols设置输入域的列数 ;wrap设置是否换行;

表单设计案例------学生入校注册页面设计

<html>
<head>
<title>学生信息注页面</title>
</head>
<body>
<h3 align="center">学生信息注册</h3>
<form name="stu" action="">
<table>
<tr><td>姓名:</td><td><input type="text" name="stuName"></td></tr>
<tr> <td>性别:</td><td>
<input type="radio" name="stuSex" checked="checked">男
<input type="radio" name="stuSex" checked="checked">女
</td>
</tr>
<tr><td>出生日期</td>
<td><input type="text" name="stuBirthday"></td>
<td>按照格式yyy-mm-dd</td>
</tr>
<tr><td>学校:</td><td><input type="text" name="stuSchool"</td></tr>
<tr><td>专业:</td>
<td><select name="stuSeltct2">
<option selected>计算机科学与技术</option>
<option >网络工程</option>
<option>物联网工程</option>
<option>应用数学</option>
</select>
</td>
</tr>
<tr><td>体育特长:</td>
<td colsopan=2>
<input type="checkbox" name="stuCheck">篮球
<input type="checkbox" name="stuCheck">排球
<input type="checkbox" name="stuCheck">足球
<input type="checkbox" name="stuCheck">游泳
</td>
<tr>
<tr><td>上传照片:</td><td colspan="2"><input type="file"></td></tr>
<tr><td>密码:</td><td><input type="password" name="stuPWD"></td></tr>
<tr><td>个人介绍:</td>
<td colspan="2"><textarea name="Letter" rows="4" cols="40"></textarea></td>
</tr>
<tr>
<td ><input type="submit" value="提交">
<input type="reset" value="取消">
</td>
</tr>
</table>
</form>
</body>
</html>

3.HTML框架标签与框架设计

页面分割用<frame>标记与<frameset>标记来定义的,其中<frame>标记用来定义框架,而<framset>标记则用来定义框架集

3.1窗口的分割与设置

3.1.1 分割框架的语法结构:

<frameset rows="高度1,高度2...."或者  cols=“宽度1,宽度2.......”>

   <frame src="网页1">

   <frame src="网页2">

  .......

</frameset>

语法说明:

(1)row属性是表示水平分割,cols属性是垂直分割。

(2)rows(或cols)属性的值代表个子窗口的高度(或宽度)

·对于rows,是从上到下分割,各子窗口的高度依次为高度1,高度2,....,直到最后一个评分完剩下的

·对于cols,是从左到右分割,各子窗口的宽度依次为宽度1,宽度2,....直到最后一个平分完之后剩下的

(3)设置高度(宽度)的数值方式有以下两种

·采用整数设置,单位为像素(px)

例如:<frameset rows="100,200,*">

解释:该语句将窗口水平分为3个子窗口,第一个高度为100个单位,第二个高度为200单位,第三个高度为-300

·采用百分比设置

例如:<framset rows="20%,50%">

解释:平分为3个子窗口,第一个高度占原高度的20%,第2个高度占原高度的50%,第三个占原高度30%.

3.1.2 窗口的嵌套分割

将水平分割框架与垂直分割框架实现嵌套

3.2 子窗口的设置

基本语法:

<frameset src="html文件的位置" name="子窗口的名称" scrolling=yes或 no 或者auto>

语法说明:

·name属性指定子窗口的名称,在该子窗口内显示由src属性指定的HTML文件网页内容

·scrolling属性用于设置控制窗口框架中是否显示滚动条,yes显示滚动条,no不显示,auto为自动;

在框架中定义了一个子窗口main,在main中显示jc.html网页

<frameset set="jc.html" name="main " scrolling="auto">

3.3 target属性

  在框架结构子窗口的HTML文档中如果含有超链接,当用户点击该链接时,目标网页显示的位置有target

属性指定,若没有指定则在当前子窗口打开。

·target属性使用格式:

<a href="目标网页地址" target="显示目标网页的子窗口名字">超链接文字</a>

·若jc.html中有一个超链接,再点击该链接后,网页newhtml将要显示在名为main的子窗口中,如下

<a href="new.html" target="main">需要链接的文本

2017.9.20 HTML学习总结----下拉列表标签的更多相关文章

  1. 2017.9.18 HTMl学习总结----input标签的额type

    2.1.3  HTML表单标签与表单设计 (1)表单的组成:文本框(text),密码框(password),多行文本框(Multiline text box).  单选按钮框(Single - rad ...

  2. 2017.9.17 HTML学习总结---table标签

    接上: 2.1.3  HTML表单标签与表单设计 表单是用户与服务器交互的主要方法,用户在表单中输入数据,提交给服务器程序来处理. (1)表单的组成: 文本框(text),密码框(password), ...

  3. 2017.9.14 HTML学习总结---超链接标签图片标签

    2.4 超链接标签 定义:它是指从一个对象指向另一个对象的指针,它可以是网页中的一段文字  也可以是一张图片,以实现从一个页面到另一个页面的跳转. 格式:<a href="url&qu ...

  4. 回望2017,基于深度学习的NLP研究大盘点

    回望2017,基于深度学习的NLP研究大盘点 雷锋网 百家号01-0110:31 雷锋网 AI 科技评论按:本文是一篇发布于 tryolabs 的文章,作者 Javier Couto 针对 2017 ...

  5. 学习笔记_Java_day13_JSTL标签库(1、2、3、4、5、6、7、8)

    1.一种标签语言 day13 l  JSTL标签库(重点) l  自定义标签(理解) l  MVC设计模式(重点中的重点) l  Java三层框架(重点中的重点) JSTL标签库 1 什么是JSTL ...

  6. 前端学习(一) body标签(下)

    今日主要内容: 列表标签 <ul>.<ol>.<dl> 表格标签 <table> 表单标签 <fom> 一.列表标签 列表标签分为三种. 1 ...

  7. JUnit5学习之五:标签(Tag)和自定义注解

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  8. 2017.12.20 Java中的 IO/XML学习总结 File类详细

    IO / XML 一.File类 1.定义/概念 Java是面向对象的语言,要想把数据存到文件中,就必须要有一个对象表示这个文件.File类的作用就是代表一个特定的文件或目录,并提供了若干方法对这些文 ...

  9. 2017/01/20 学习笔记 关于修改和重打jar包

    背景 客户提供了jar包,但发现db表中缺少一个字段,db追加以后需要修改jar包中的source. 操作  如何修改jar包中的source并重新打一个新的jar包,做了如下操作. ① 开包 解压j ...

随机推荐

  1. Vue.js-----轻量高效的MVVM框架(二、Vue.js的简单入门)

    1.hello vue.js! (1)引入vue.js <script type="text/javascript" src="js/vue.js"> ...

  2. 转 PyCharm 进行调试 以及怎么熟悉一个已经成熟的项目的代码和断点 以及 jetBrains pycharm快捷键

    https://blog.csdn.net/guider2334/rss/list Ctrl + Q 现实document视图,查看选择元素的详细信息        (重要) Ctrl + Alt + ...

  3. Nuxt 2.3.X 配置sass

    1.需要安装node-sass和sass-loader就行了 npm i -S node-sass sass-loader

  4. web常见测试点总结

    上周五小组内对Web的常见测试点进行了交流学习,虽然这些信息网上一搜都一大把,但整理的过程中自己脑袋瓜里又重新回顾了一遍,大家都很认真的在学习,互相补充着,现总结如下,欢迎同行留言 一.新增.修改 用 ...

  5. 移动测试之appium+python 入门代码(二)

    ps: 对于环境安装可能会碰到各种问题,还是要一一解决. 执行: appium-doctor 显示上边界面说明,环境已完成. 同时将手机连接主机(用数据线) ^_^ 执行 adb devices 显示 ...

  6. CAD安装失败怎样卸载CAD 2016?错误提示某些产品无法安装

    AUTODESK系列软件着实令人头疼,安装失败之后不能完全卸载!!!(比如maya,cad,3dsmax等).有时手动删除注册表重装之后还是会出现各种问题,每个版本的C++Runtime和.NET f ...

  7. caffe学习资料

    1.利用Caffe做回归(regression) http://www.cnblogs.com/frombeijingwithlove/p/5314042.html

  8. entity framework discriminator error

    前几天使用code first碰到错误:列名 'Discriminator' 无效.这是一个很少见的错误,搜索了很久才发现是code first的poco实体对象的继承问题. 比如,我定义了一个实体类 ...

  9. 【计算机网络】一步一步学习IP路由流程

    TCP/IP协议簇是目前互联网应用最广的协议栈,谈到TCP/IP协议栈就不能不讲一讲IP路由的问题,因为在我们使用的网络通信中几乎每时每刻都在发生着IP路由的事件…….当你在网络世界中还是一位新手的时 ...

  10. 二叉搜索树-php实现 插入删除查找等操作

    二叉查找树(Binary Search Tree),(又:二叉搜索树,二叉排序树)它或者是一棵空树,或者是具有下列性质的二叉树: 若它的左子树不空,则左子树上所有结点的值均小于它的根结点的值: 若它的 ...