2021-11-22

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

    <form action="成功.html">

        <fieldset>

            <legend>选项全给你框起来</legend>

        <!-- form表单,action填写地址 maxlength最大值是多少 -->

     <label for="yonghuming">用户名:</label>

     <input type="text" id="yonghuming"><!-- label是点击后出现光标,其中的for和id对应 -->

    <label for="mima">密码:</label><input type="password" id="mima">

    <p>

    <input type="submit" value="提交"><!-- subit提交 -->

    </p>

    <p>

        <input type="checkbox" value="1">篮球<!-- checkbox是复选框 -->

        <input type="checkbox" value="2">足球

        <input type="checkbox" value="3">排球

    </p>

    <p>

        是<input type="radio" name="sex" checked><!--radio单选框  checked默认选项 -->

        否<input type="radio" name="sex">

    </p>

    <p>

        <input type="reset"><br><!-- 重置 -->

        <input type="file"><!-- 文件上传 -->

        <input type="image" src="img1.png" width="100px" height="100px">

        <select name="qiche" id="4"><!-- select下拉选框 -->

            <option value="5">大众</option>

            <option value="5">小众</option>

        </select>

        <textarea name="" id="" cols="30" rows="10">  奥术大师大所大多撒多

        </textarea><!--多行文本  cols列数,文本框的宽度 rows行数,文本框的高度  -->

        </fieldset>

        <fieldset>

            <legend>XXX</legend><!-- 整合,可以将之前的内容整合在同一个框内 -->

           奥术大师大所大大所多无 <!-- 这里是内容  -->

        </fieldset>

        <!-- readonly只读属性,不能输入。只作用于文本框 -->

        <input type="text" readonly>

        <!-- disabled禁用 -->

        <input type="text" disabled><!-- 这俩单词可直接作用   下拉框,复选框,单选框 -->

    </p>


    </form>

</body>

</html>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容