标签：标签 表单 输入框 HTML 滑雪 type 属性

HTML标签的基本使用：表单

form标签

表单，容器级标签、存放可输入的控件、如果输入的表单需要提交到数据库，所有的控件都需要被form表单包裹

method：提交数据的方法，属性：post、get

action：是数据提交的位置

input标签

输入框的一种，可以通过type属性拓展功能

type默认是text

<form action="">
        <input type="text">

</form>

1、type=“password”

密码框，输入以掩码形式显示

<input type="password" placeholder="请输入密码">

2、type=“radio”

单选框，需要设置相同的name属性

        <input type="radio" name="sex">男
        <input type="radio" name="sex">女
        <input type="radio" name="sex">保密

3、type=“checkbox”

<input type="checkbox" name="hobby">游泳
<input type="checkbox" name="hobby">滑雪
<input type="checkbox" name="hobby">篮球
<input type="checkbox" name="hobby">排球

checked="checked"默认选择

<input type="checkbox" name="hobby" checked="checked">游泳
<input type="checkbox" name="hobby">滑雪
<input type="checkbox" name="hobby">篮球
<input type="checkbox" name="hobby">排球

label标签

点击文字也可以选中选项

        <label>
            <input type="checkbox" name="hobby">游泳
        </label>

        <label>
            <input type="checkbox" name="hobby">滑雪
        </label>

        <label>
            <input type="checkbox" name="hobby">冲浪
        </label>

input的两个重要属性

value：输入框默认值

placeholder：输入框提示文本

 <input type="text" placeholder="请输入">

textarea标签

文本域，双标签，可输入多行文本

cols:列的字符数

rows：行数

    <p>
        自我介绍：
        <textarea cols="50" rows="20" placeholder="请输入自我介绍"></textarea>
    </p>

拖动右下角可缩放文本框

style设置不可缩放

<textarea cols="50" rows="20" placeholder="请输入自我介绍" style="resize:none"></textarea>

下拉框

select>option

    <p>
        籍贯
        <select>
            <option>北京</option>
            <option>上海</option>
            <option>广州</option>
            <option>深圳</option>
        </select>
    </p>

默认选择selected=“selected”

<p>
        籍贯
        <select>
            <option>北京</option>
            <option>上海</option>
            <option selected="selected">广州</option>
            <option>深圳</option>
        </select>
</p>

标签：标签,表单,输入框,HTML,滑雪,type,属性
来源： https://blog.csdn.net/weixin_53469581/article/details/123074866

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。