Html页面窗口框架与表单

最新推荐文章于 2024-09-15 17:43:02 发布

华子华

最新推荐文章于 2024-09-15 17:43:02 发布

阅读量2.8k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：前端语言学习文章标签： html框架表单

本文链接：https://blog.youkuaiyun.com/wang975380547/article/details/54693799

前端语言学习专栏收录该内容

3 篇文章

订阅专栏

本文介绍了HTML中的框架使用，包括frameset的基本语法和窗口大小的控制。同时讲解了超链接的目标属性，如_blank, _self, _parent, _top。接着详细阐述了HTML表单的创建，包括各种表单元素的类型及其属性，如text, password, checkbox, radio等，并解释了action和method属性在表单提交中的作用。" 100871588,9001480,Bee ORM框架：十分钟快速上手的数据库操作库,"['JAVA开发', '数据库', 'ORM框架', '开发工具']

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.首先在html代码中的框架不能用<body></body>,基本语法：

<frame src = " URL" noresize></frame>
........

</frameset>

其中的的src指向的URL地址就是要显示的html文件，noresize表示页面窗口大小不可改变。

2.各窗口的尺寸设置：

(1).<frameset cols=30%,20%,50%>   表示按照列来划分
(2).<frameset rows=30%,20%,50%>   表示按照行来划分
(3).纵横排列多个窗口：
<frameset cols=20%,*>  <!--*表示下面的界面将占据余下界面-->
<frame src="A.html">
     <frameset rows=40%,*>
     <frame src="B.html">
     <frame src="C.html">
     </frameset>
</frameset>

3.窗口相互操作：

<a href="right.html" target = "right">Right1</a><br/>
<a href="right2.html" target = "right">Right2</a><br/>

其中：

特殊的 4 类操作(很有用喔)
<a href="url" target="_blank"> 新窗口
<a href="url" target="_self"> 本窗口
<a href="url" target="_parent"> 父窗口
<a href="url" target="_top"> 整个浏览器窗口

4.表单元素

基本语法：

<form action="ok.html" method= "*">
...

...
<input type=" #" name = " "> <input type= " #",name = " ">
</form>

* = GET, POST; # = text, password, checkbox, radio, image, hidden, submit, reset( 文本框，密码框，复选框，单选框，图片按钮，隐藏域，提交按钮，重置按钮); name后面的输入为表单元素名字。
text：文本框，input默认的type，不写就是这个，value表示文本框里的值。
password：密码框，value表示密码框里的值。
submit：提交按钮，value表示按钮上的文字
button：普通按钮，value表示按钮上的文字
reset：重置按钮，value表示按钮上的文字
radio：单选框，value表示该单选框的真实值（一般真实值和数据库对应，显示的值给用户参考的）
checkbox：复选框，value表示该复选框的真实值
hindden：隐藏表单域，value表示该表单域的值。
action 表示指定把请求交给那个页面，例如把请求交给ok.html, method里面的get会把文本域的提交内容在地址栏显示，但是post就不会在地址栏显示。

例如：

 <h1>登录界面<h1>
 <form action = "ok.html" method = "post"><html>
<head>
<title>表单元素测试</title>
</head>
<body>

表单的其他元素：

名字：<input type = "text" value "输入名字..." name = "username"/><br/>
密码：<input type = "password" name ="pwd"/><br/>

****喜欢的水果(复选框)*****<br/>       <!--这里的name可以是不一样的，但最好是一样的-->
<input type = "checkbox" name = "水果">西瓜<br/>
<input type = "checkbox" name = "水果">苹果<br/>

****选择性别（单选框）****<br/>
<input type = "radio" name = "sex"/>男<br/>  <!--这里的name必须是一样的-->
<input type = "radio" name ="sex"/>女<br/>

****隐藏域****（即可提交数据，又不影响界面）<br/>
<input type = "hidden" value= "123" name = "salary"/>

****下拉菜单****
选择你的出生地：
<select name = "biradd">
<option value = "">---请选择---</option> <!--在这里可以控制下拉菜单的宽度-->
<option value = "beijing">北京</option>
<option value = "shanghai">上海</option>
<option value = "chongqing">重庆</option>
</select><br/>

****文本域****<br/>
<textarea cols = "30" rows = "10">请在这里输入.....</textarea><br/>

****请选择你要上传的文件****<br/>
<input type = "file" name = "myfile"/>请选择文件
</body>
</html>