#WEB安全基础 : HTML/CSS | 0x10.1更多表单

TerryCai 发布于2019-04-23 11:53 / 692人阅读

摘要：黑体来认识更多的表单吧，增加知识面黑体我只创建了一个帮助你认识它们黑体以下是代码单按钮输入单选和中间夹的东西在网页上显示一个类型的选项推荐用同样的值，增强代码可读性分割线复选框输入多选

来认识更多的表单吧，增加知识面

我只创建了一个index.html帮助你认识它们

以下是代码

 1 DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset = "utf-8">
 5 head>
 6 <body>
 7 
 8 <form action = "" method = "POST">
 9 <input type = "radio" name = "yesorno" value = "yes">Yinput>                    
10 <br>
11 <input type = "radio" name = "yesorno" value = "no">Ninput>
12 form>
13 <hr>        
14 
15 <form action = "" method = "POST">        
16 <input type = "checkbox" name = "spice" value = "Salt">Saltinput>
17 <br>
18 <input type = "checkbox" name = "spice" value = "Pepper">Pepperinput>
19 <br>
20 <input type = "checkbox" name = "spice" value = "Garlic">Garlicinput>
21 form>
22 <hr>
23 
24 <form action = "" method = "POST">        
25 <textarea name = "name" rows = "10" cols = "50">My name is textarea>
26 form>
27 <hr>
28 <p>
29 你喜欢什么颜色?
30 p>
31 <form action = "" method = "POST">
32 <select name = "color">                        
33 <option value = "Black">黑色option>        
34 <option value = "White">白色option>
35 <option value = "Blue">蓝色option>
36 <option value = "Red">红色option>
37 select>
38 form>
39 <hr>
40 <form action = "" method = "POST">
41 <input type = "number" min = "0" max = "9">        
42 form>
43 <hr>
44 <form action = "" method = "POST">
45 <input type = "range" min = "0" max = "15" step = "5">        
46 form>
47 <hr>
48 <form action = "" method = "POST">
49 <input type = "date">        
50 form>
51 <hr>
52 
53 
54 <form action = "" method = "POST">
55 <input type = "email">        
56 <input type = "tel">        
57 <input type = "url">        
58 form>
59 body>
60 html>

以下是显示效果

发挥你的想象力创造出更整洁，更有用的表单

//本系列教程基于《Head First HTML与CSS(第二版)》,此书国内各大购物网站皆可购买

转载请注明出处 by:M_ZPHr

最后修改日期：2019-01-17

云服务器 idc机房托管 html+css基础 web表单 java表单web web自定义表单

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/1296.html

#WEB安全基础 : HTML/CSS | 文章索引

摘要：黑体本系列讲解安全所需要的和黑体安全基础我的第一个网页黑体安全基础初识黑体安全基础初识标签黑体安全基础文件夹管理网站黑体安全基础模块化黑体安全基础嵌套列表黑体安全基础标签拓展和属性的使用黑体安全基础嵌套本系列讲解WEB安全所需要的HTML和CSS #WEB安全基础 : HTML/CSS | 0x0 我的第一个网页 #WEB安全基础 : HTML/CSS | 0x1初识CSS #WEB安全基...

EscapedDog 2019-04-23 11:53 评论0 收藏0
#WEB安全基础 : HTML/CSS | 0x10实现交互_表单

摘要：黑体先看看表单如何工作吧黑体请求黑体响应黑体简要工作流程黑体浏览器加载页面黑体用户输入数据黑体用户提交表单黑体服务器响应黑体概念都清楚了，我们来写表单吧黑体只有一个文件黑体这是显示黑体你先看看表单如何工作吧请求响应简要工作流程：浏览器加载页面用户输入数据用户提交表单服务器响应概念都清楚了，我们来写表单吧只有一个html文件这...

lwx12525 2019-04-23 11:53 评论0 收藏0
#WEB安全基础 : HTML/CSS | 0x11 浅谈GET和POST

摘要：黑体中的和请求方法黑体我上次提到了和，现在就让你来认识一下这些新朋友黑体请看图黑体黑体和都是将用户输入到浏览器的数据发送给服务器，不过采用了两种不同的方式，会打包表单变量，在后台把它们发送到服务器，也会打包表单变量，但会HTTP中的GET和POST请求方法我上次提到了GET和POST，现在就让你来认识一下这些新朋友请看图 POST和GET都是将用户输入到浏览器的数据发送给服务器，不...

zhangrxiang 2019-04-23 11:53 评论0 收藏0
【连载】前端个人文章整理-从基础到入门

摘要：个人前端文章整理从最开始萌生写文章的想法，到着手开始写，再到现在已经一年的时间了，由于工作比较忙，更新缓慢，后面还是会继更新，现将已经写好的文章整理一个目录，方便更多的小伙伴去学习。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 个人前端文章整理从最开始萌生写文章的想法，到着手...

madthumb 2019-08-23 14:15 评论0 收藏0
【连载】前端个人文章整理-从基础到入门

摘要：个人前端文章整理从最开始萌生写文章的想法，到着手开始写，再到现在已经一年的时间了，由于工作比较忙，更新缓慢，后面还是会继更新，现将已经写好的文章整理一个目录，方便更多的小伙伴去学习。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 个人前端文章整理从最开始萌生写文章的想法，到着手...

Labradors 2019-08-05 15:50 评论0 收藏0