Home > Web Front-end > HTML Tutorial > Detailed explanation of examples of form components in html

Detailed explanation of examples of form components in html

黄舟
Release: 2017-11-01 10:41:39
Original
1647 people have browsed it

HTML forms are used to collect different types of user input. Below I will share with you the html Form component example code through code. Friends who are interested can refer to it

Without further ado, I will post the code directly for you. The specific code is as follows Shown:

<!DOCTYPE html>  
<html>  
<head>  
<meta charset="UTF-8">  
<title>Insert title here</title>  
</head>  
<body>  
    <!--  
    如果要给服务端提交数据 表单中的组件必须有name和value属性  
    用于给服务端获取数据   
     -->  
<from>输入名称:<input type="text" name="user" value=""/><br/>  
        输入密码:<input type="password" name="passwd" value=""/>  
        <br/>  
      选择性别:<input type="radio" name="sex" vlaue="nan"/> 男  <input type="radio" name="sex" value="nv" checked="checked"/> 女  
    <br/>  
    选择技术:  
        <input type="checkbox" name="tech" value="java"/>Java  
        <input type="checkbox" name="tech" value="html"/>html  
        <input type="checkbox" name="tech" value="css"/>CSS<br/>  
    选择文件:  
        <input type="file" name="file" /><br/>  
    一个图片:<input type="image" src="11.jpg" ><br/>  
    <!-- 数据不需要客户端指定 但是可以将其提交服务端 -->  
    隐藏组件:<input type="hidden" name="mykey" value="myvalue"/><br/>  
    一个按钮:<input type="button" value="有个按钮" onclick="alert(&#39;有个按钮&#39;)"><br/>  
    <select name="contry">  
        <option value="none">--选择国家-</option>  
        <option value="usa">美国</option>  
        <option value="en">英国</option>  
        <option value="cn" selected="selected">中国</option>  
    </select>  
    <textarea name="text"></textarea>  
    <br/>  
    <input type="reset" value="清除数据"/><input type="submit" value="提交数据"/>  
<from>  
</body>  
</html>
Copy after login

Summary


The above is the detailed content of Detailed explanation of examples of form components in html. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template