HTML笔记3

21,label标签

<label for="...">...</label>

<label>...</label>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

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

    <title>Document</title>

</head>

<body>

     <!-- 点击文字也可以选中 -->

     <!-- 写法一 -->

     性别: <input type="radio" id="man" name="gender" checked>

     <label for="man">男</label>

     <input type="radio" id="women" name="gender">

     <label for="women">女</label>

     <br><br>

     <!-- 写法二 -->

     性别: <label><input type="radio" name="gender1" checked>男</label>

     <label><input type="radio" name="gender1">女</label>

</body>

</html>

22,按钮

<button type="submit">提交</button>

<button type="reset">重置</button>

  <button type="button">普通按钮</button>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

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

    <title>Document</title>

</head>

<body>

    <!-- form表单区域标签 -->

    <form action="数据提交地址">

    <!-- 按钮 -->

    用户名: <input type="text" placeholder="请输入用户名"><br><br>

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

    <!-- 省略type属性,功能依然是提交 -->

    <button type="submit">提交</button>

    <br>

    <button type="reset">重置</button>

    <br>

    <button type="button">普通按钮</button>

</form>

</body>

</html>

 23,布局标签

<div>这是div标签</div>

<span>这是span标签</span>

网页中显示字符:&nbsp

显示尖括号:&lt p&gt

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

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

    <title>Document</title>

</head>

<body>

    <!-- div俗称大盒子 -->

    <div>这是div标签</div>

    <div>这是div标签</div>

    <!-- span俗称小盒子 -->

    <span>这是span标签</span>

    <span>这是span标签</span>

    <br><br><br>

    <!-- 网页中显示字符 -->

    叶上初阳干宿雨&nbsp水面清圆&nbsp一一风荷举

    <br><br><br>

    <!-- 显示尖括号p -->

    &lt;p&gt;

</body>

</html> 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值