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>

相关推荐
EveryPossible8 分钟前
静态箭头连线
开发语言·javascript·ecmascript
伍哥的传说9 分钟前
QRCode React 完全指南:现代化二维码生成解决方案
前端·javascript·react.js·qrcode.react·react二维码生成·qrcodesvg·qrcodecanvas
listhi52018 分钟前
Map对象在JavaScript循环中的使用
开发语言·前端·javascript
贝塔实验室35 分钟前
两种常用的抗单粒子翻转动态刷新方法
论文阅读·经验分享·笔记·科技·学习·程序人生·fpga开发
范纹杉想快点毕业7 小时前
ZYNQ PS 端 UART 接收数据数据帧(初学者友好版)嵌入式编程 C语言 c++ 软件开发
c语言·笔记·stm32·单片机·嵌入式硬件·mcu·51单片机
雾恋8 小时前
最近一年的感悟
前端·javascript·程序员
华仔啊8 小时前
Vue3 的 ref 和 reactive 到底用哪个?90% 的开发者都选错了
javascript·vue.js
A黄俊辉A9 小时前
axios+ts封装
开发语言·前端·javascript
小李小李不讲道理9 小时前
「Ant Design 组件库探索」四:Input组件
前端·javascript·react.js
茯苓gao10 小时前
STM32G4 电流环闭环
笔记·stm32·单片机·嵌入式硬件·学习