• 表单常用语法


    <!-- 表单  写在body里,就平时上网注册填写的东西-->
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    
        <form action="www.baidu,com">
        <!-- 1 表单元素  账号
        value 指定默认值
        maxlength 最大长度
        readonly 只读
        -->
        <p>
            账号:<input type = "text" value="Kwin"  maxlength=15/>
        </p>
        
        <!-- 2 密码,修饰属性同上  -->
        <P>
            密码:<input type="password"/>
        </P>
        
        <!-- 3 单选 
        name 组名,定义为同一组,才可以区分互斥
        checked 默认选中
        -->
        <P>
            性别:<input type="radio" name="sex" checked/><input type="radio" name="sex"/></P>
        
        <!-- 4 多选 -->
        <p>兴趣:
            <input type="checkbox" />音乐
            <input type="checkbox" />读书
            <input type="checkbox" />跑步
            <input type="checkbox" />篮球
            <input type="checkbox" />足球
        </p>
        <!-- 5 文件筐  -->
        <p>头像:
            <input type="file"/>
        </p>    
        
        <!-- 6 隐藏框 -->
        <p>
            <input type="hidden">
        
        </p>
        
        <!-- 7 提交按钮 8 重置  -->
        <p>
            <input type="submit" value="注册"/>
            <input type="reset" value="重置"/>
        </p>
        
        <!-- 9 普通按钮 ,功能由js代码自己写  -->
        <p><input type="button" value="普通按钮"/>
        </p>
        
        <!-- 10 标签
        label:用来管理表单中的文本,将文本与控件绑定,增大可选择面积,方面老年等看不清小按钮人选择使用
         id:用来区分标签名与for配合使用
         -->
        <p>
            <input type="checkbox" id="c1"/>
            <label for="c1">我已阅读并自愿接受此协议!</label>
        </p>
        
        <!-- 11 文本域  -->
        <p>简介:
            <textarea cols="10" rows="3">请在此处输入简介!
            </textarea>
        </p>
        
        <!-- 12 下拉选项框-->
        <p>
        城市:
        <select>
            <option selected>北京</option>
            <option>上海</option>
            <option>合肥</option>
            <option>南京</option>
        </select>
        </p>
    
        <!-- 13 为控件分组
            <fieldset> :为控件分组
            <legend> :为分组指定一个标题
        -->
        <fieldset>
            <legend>地址信息栏</legend>
            地址:<input type="text"/> <br/>
            邮编:<input type="text"/> <br/>
        </fieldset>
        
        
        
    
    </form>
    </body>
    </html>

    效果:

  • 相关阅读:
    bzoj1066: [SCOI2007]蜥蜴
    bzoj3504: [Cqoi2014]危桥
    bzoj2756: [SCOI2012]奇怪的游戏
    bzoj1570: [JSOI2008]Blue Mary的旅行
    Ultra-QuickSort
    Bin Packing
    Watering Grass
    区间覆盖
    抄书 Copying Books UVa 714
    分馅饼 Pie
  • 原文地址:https://www.cnblogs.com/kwinwei/p/10591931.html
Copyright © 2020-2023  润新知