2020-08-23

你给我一夜我给你十月

于 2020-08-23 19:31:06 发布

阅读量177

点赞数

本文链接：https://blog.csdn.net/weixin_50272396/article/details/108187193

版权

html的列表和表单

.**有序列表：**
ol (order list) 有序列表中的每一项用li表示type属性表示序号的类型：1表示数字， A/a表示字母，i/I表示罗马数字
代码示例为
<ol type="">
<li>www</li>
<li>www</li>
<li>www</li>
</ol>
.**无序列表：**
ul unorder list有序列表中的每一项用li表示type属性表示序号的类型：circle表示。disc表示.square表示正方形
代码示例为
<ul type="square">
<li>第一项
<ul>
<li>1-1</li>
<li>1-2</li>
<li>1-3</li>
</ul>
</li>
<li>第二项</li>
<li>第三项</li>
</ul>

自定义列表

语法格式：
<dl>
   <dt>标题</dt>
   <dd>内容1</dd>
   <dd>内容2</dd>
   <dd>内容3</dd>
</dl>

二. 表单

在HTML中，表单是用来收集用户信息的工具，一个完整的表单由三部分组成：
（1）表单区域：由form标签包裹的区域称为表单域，这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。
（2）表单标签：包括文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。
（3）表单按钮：包括提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。
表单的工作原理
（1）浏览者访问到表单页面后，在表单中填写或选择必要的信息，最后单击"提交"按钮，于是填写或选择的信息就按照指定方法发送出去，通过网络传输到服务器端，由服务器端特定程序进行处理，处理的结果通常是向浏览者返回一个页面，同时在服务器端完成特定功能。
（2）表单，在网页中的作用不可小视，主要负责数据采集的功能，比如你可以采集访问者的名字和email地址、调查表、留言簿等。
以下为表单代码：
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>表单</title>
</head>
<body>
   <b>
   在HTML中，表单是用来收集用户信息的工具，一个完整的表单由以下三部分组成：
   </b>
   <ol>
       <li>表单域</li>
       <li>提示信息</li>
       <li>表单控件</li>
   </ol>
   <hr>

   <h4>一.表单控件</h4>
   <b>1.input控件</b><br>
   <p>单标签输入控件</p>
       实例：
   <p>用户名：<input type="text" value="请输入您的名字"></p>

   <p>密    码：<input type="password" name="请输入最多六位的密码" maxlength="6"></p>

   <p>性    别：男<input type="radio" name="sex" checked="checked ">女<input type="radio" name="sex"></p>

   <p>爱    好：篮球<input type="checkbox">足球<input type="checkbox">羽毛球<input type="checkbox"></p>

   <p>搜索:<input type="button" value="普通按钮"></p>

   <p>提交:<input type="submit"></p>

   <p>重置:<input type="reset"></p>

   <p>图像形式的按钮:<input type="image" src="../图片/go.png" width="50"></p>

   <p><input type="file" name="上传文件"></p>

   <hr>
       <b><i>属性:</i></b><br><img src="../图片/input.png" width="600">
   <hr>

   <b>2.lable标签</b><br>
   <p>结合input控件使用,可使得点击前面的文字也可输入</p>


   <p>如果lable中含有我两个input控件，则默认第一个表单，若需要指定第二个表单，可采用for id的形式</p>

   <label for="i2"><p>密    码：<input type="password" maxlength="6" id="i1"> <input type="password" maxlength="6" id="i2"></p></label>
   <hr>

   <b>3.textarea控件(文本域)</b><br>
   <p>用来创建多行文本输入框</p>
   <p>留言板:<br><textarea cols="60" rows="5">请输入您的留言</textarea></p>
   <hr>

   <b>4.下拉菜单</b><br>
   <p>采用select标签实现</p>
   籍贯：
   <select>
       <option>点击选择您的省份</option>
       <option selected="selected">江苏</option>
       <option>湖北</option>
       <option>东北</option>
       <option>安徽</option>
   </select>
       <select>
       <option>点击选择您的城市</option>
       <option selected="selected">南京</option>
       <option>武汉</option>
       <option>沈阳</option>
       <option>合肥</option>
   </select>
   <hr>

   <h4>二.表单域</h4>
   <b>1.form标签</b><br>
   实例：
   <form action="后台服务器" method="post" name="f1">
      <p>用户名：<input type="text" name="username"></p>
       <p>密    码：<input type="password" name="password" maxlength="6"></p>
       <p><input type="submit" value="提交"> <input type="reset"></p>
   </form>
   注意：<br>
       1.action属性是用于指定接收并处理表单数据的服务器程序的url地址<br>
       2.method有两种提交方式，get的提交速度块，但是会显示，不安全，post的提交速度慢，但不显示，安全

</body>
</html>