html之input系列标签
input属性太多,我这里仅列出几个我喜欢的吧。
disabled:首次加载时禁用此元素
checked:首次加载时选中此元素
form:输入字段所属的一个或多个表单
hieght:定义input字段的高度,适用于type=image
max_length:输入字段中字符的最大长度
min:与上相反
name:定义input元素的名称
pattern:输入字段值的模式或格式
multiple:允许一个以上的值
required:输入字段的值是必须的
size:输入字段的宽度
width:输入字段的宽度,适用于type=image
type:
button 按扭
checkbox 复选框
file 文件
hidden 隐藏
imag 图片
password 密码
radio 单选框
submit 提交按扭
text 文本
value:input元素的值,提交后台的标识
实例演示区:
文本域:form表单:块级标签
<form> #文本域
姓:<input type="text" name="firstname">
名:<input type="text" name="lastname">
<input type="submit" value="提交">
</form>
<form>#密码
用户名:<input type="text" name="user">
密码:<input type="password" name="password">
<input type="submit" value="提交">
</form>
<form>#复选框
我喜欢:
汔车:<input type="checkbox">
美女:<input type="checkbox">
电影:<input type="checkbox">
<input type="submit" value="提交">
</form>
<form>#单选框,name名称要一致才能互斥
你的姓别
男:<input type="radio" name="r">
女:<input type="radio" name="r">
<input type="submit" value="提交">
</form>
<form>#围绕数据的fileset
<fieldset>
<legend>健康信息</legend>
身高:<input type="text">
体重:<input type="text">
</fieldset>
</form>
效果图:

好玩的:提交文件给后台并保存文件
说明:后台用的是django接收,有看到的朋友自己搭建,这里只列出过程
views.py
from django.shortcuts import render,HttpResponse
import os
# Create your views here.
def upload(request):
if request.method=='POST':
myfiles = request.FILES.get('myfile',None)
if not myfiles:
return HttpResponse('no files need upload..')
des_file = os.path.join(r'c:\test',myfiles.name)
with open(des_file,'wb+') as f:
for each_block in myfiles.chunks():
f.write(each_block)
return HttpResponse('upload over...') def index(request):
return render(request,'index.html')
配置好URL地址:

在views中编写接收文件后的处理函数

编写索引页代码

选择上传文件 :

html之input系列标签的更多相关文章
- 第一篇-Html标签中head标签,body标签中input系列,textarea和select标签
第十四周课程(1-12章节) HTML 裸体 CSS 穿华丽衣服 Javascript 动起来 一 HTML (20个标签) 1.我们的浏览器是socket客户端 2.一套规则,浏览器认识的规则 ...
- html的body内标签之input系列2
一,input系列:name属性用于让后台拿数据.value 只是在屏幕上的显示. 1. input type='text' name='query' value="张三"(相当于 ...
- html基础 表单标签 input系列 以及优化方法
场景:在网页中显示手机用户信息的表单效果. 如:登录页.注册页标签名:input 用法是通过改变type属性值,来展示不同效果 1.1 html 代码 <!--placeholder 提示符又叫 ...
- input[file]标签的accept=”image/*”属性响应很慢的解决办法
转自:http://blog.csdn.net/lx583274568/article/details/52983693 input[file]标签的accept属性可用于指定上传文件的 MIME类型 ...
- 从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别
背景: 在清空input file标签选中值时,分别用了以下方法,发现有的对有的错: [√]$("#file")[0].value = ""; [√]$(&qu ...
- HTML:Input元素标签的详细介绍
总结Input的标签: Input表示Form表单中的一种输入对象,其又随Type类型的不同而分文本输入框,密码输入框,单选/复选框,提交/重置按钮等,下面一一介绍.1,type=text输入类型是t ...
- 4、html的body内标签之input系列
一.input标签与form表单 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- html的body内标签之input系列1
1. Form的作用:提交当前的表单. 类似于去了银行提交的纸质单子,递到后台去办理相关业务. text,password只有输入的功能:button,submit只有点击的功能.想要把这些信息提交, ...
- html input file标签的上传文件 注意点
文件上传框 代码格式:<input type=“file” name=“...” size=“15” input enctype="multipart/form-data“ maxl ...
随机推荐
- 【LeetCode OJ】Linked List Cycle II
Problem link: http://oj.leetcode.com/problems/linked-list-cycle-ii/ The solution has two step: Detec ...
- iptables配置服务器端口转发
环境: CentOS6.5,192.168.1.10,外网双向通信,绑定域名zlzkj.org: WinServer2008,192.168.1.11,外网不能直接访问到该机器,但ftp.远程桌面.M ...
- BZOJ2661 连连看 (费用流)
把所有点拆成两个,将符合条件的两个点x,y连上边,流量为1,费用为-(x+y). 做一遍最小费用最大流,最后ans div 2即可. Program bzoj2661; ; ..] of longin ...
- SQL基础,与数据类型;
net start mssqlserver 开启数据库: net stop mssqlserver 关闭数据库: net pause mssqlserver 暂停数据库: net continu ...
- Difference Between Performance Testing, Load Testing and Stress Testing
http://www.softwaretestinghelp.com/what-is-performance-testing-load-testing-stress-testing/ Differen ...
- Java 父类和子类
package chapter11; public class GeometricObject1 { private String color="white"; private b ...
- Android Packaging Problem
android Description Resource Path Location Type Error generating final archive: Debug Certificate ex ...
- Core Java Volume I — 4.7. Packages
4.7. PackagesJava allows you to group classes in a collection called a package. Packages are conveni ...
- 读metronic文档学到的几个知识点
1.RTL 同样的页面,它做了两套.为什么,因为在这个世界上,有些民族,有些语种,是从右向左来的. 2. google material design 同样的一套东西,又分别做了google mat ...
- Linux的服务器初始优化脚本。
#!/bin/bash #优化服务器启动的脚本.禁用无关账号.无关服务 #Lock User Account passwd -l xfs passwd -l news passwd -l nscd p ...