<!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>html</title>
</head>
<body>
<!-- 1.文字标签 -->
<!-- <h1>标题</h1> 标题标签h1-h7 双标签-->
<!-- <hr> 水平分割线 单标签-->
<!-- <P>我是</P> 段落标签独占一行 双标签 -->
<!-- <br> 换行标签 单标签-->
<!--
<b>加粗</b>
<strong>加粗</strong>
<u>下划线</u>
<ins>下划线</ins>
<i>倾斜线</i>
<em>倾斜线</em>
<s>删除线</s>
<del>删除线</del>
项目开发中,重要的就用strong,ines等标签表示
-->
<!-- 2.媒体标签 -->
<!-- 2.1图片标签 -->
<!-- <img src="图片的路径" alt="图片不显示的时候显示的文字"
title="这是鼠标悬停的时候显示的文字 不仅仅只用于图片,还可以用再其他标签"
width="宽,单写一个也不会变形,会等比例缩放。工作中宽高两个只要写一个," height="高度, 双写设置不当会变形"> -->
<!-- 2.2路径 -->
<!-- 绝对路径(了解):1.指盘符开头,D:\DAY\... \ 2.完整的的网咯地址:https://123/ -->
<!-- 相对路径 都在同一个一个目录里面 ./(当前目录) 下级目录 ../退出当前回到上级 /下一级 -->
<!-- 2.3音频标签 -->
<!-- <audio src="音频文件位置" controls(音频控件) autoplay(自动播放) loop(循环播放) 目前支持:mp3,wav.ogg></audio> -->
<!-- 2.4视频标签 -->
<!-- <video src="音频文件位置" controls(音频控件) autoplay(自动播放,谷歌浏览器要配合muted实现静音播放) loop(循环播放) 目前支持:mp4,webm.ogg></video> -->
<!-- 2.5链接标签 -->
<!-- <a href="链接路径 可写#空链接" target="_blank(新窗口,保留默认) _self(当前窗口覆盖原网页) 目标网页打开形式">链接文字</a> -->
<!-- 3.列表标签-->
<!--3.1无序标签 -->
<!-- <ul>只能包含li
<li>可以包含任意标签</li>
</ul> -->
<!-- 3.2有序标签 -->
<!-- <ol>只能包含li
<li>可以包含任意标签</li>
</ol> -->
<!-- 3.3自定义标签 -->
<!-- <dl>只可以包含dt/dd
<dt>第一行 可放很多</dt>
<dd>行下内容 可放很多</dd>
<dd>行下内容</dd>
</dl> -->
<!-- 4.表格标签 -->
<!-- border边距 -->
<!-- <table border="1">
<caption>表格标题</caption> -->
<!-- 表头 -->
<!-- <thead>
<tr>
<th>1表头</th>
<th>2表头</th>
<th>3表头</th>
</tr>
</thead> -->
<!-- 表格主体 -->
<!-- <tbody>
<tr>
<td rowspan="2"跨行,保留最上>1行内容</td>
<td>1行内容</td>
<td>1行内容</td>
</tr>
<tr>
<td>2行内容</td>
<td>2行内容</td>
<td>2行内容</td>
<tr>
<td>3行内容</td>
<td>3行内容</td>
<td>3行内容</td>
</tr>
</tr>
</tbody> -->
<!-- 表格底部 只有同一个标签里面才能合并,不能跨结构(thead, tbody, tfoot)合并 -->
<!-- <tfoot>
<tr>
<td colspan="3"跨列,保留最左>4行内容</td>
<td>4行内容</td>
<td>4行内容</td>
</tr>
</tfoot>
-->
<!-- </table> -->
<!--5.表单标签 单标签 -->
<!-- 5.1input按钮 -->
<!-- 文本框:<input type="text" placeholder="占位符,提示用户输入的字">
<br>
密码框:<input type="password">
<br>
单选框:<input type="radio" name="one">选项一 <input type="radio" name="one">选项二
<br>
多选框:<input type="checkbox">选项一 <input type="checkbox">选项二 <input type="checkbox">选项三
<br>
上传文件:<input type="file" multiple>(multiple 上传多个文件)
<br>
提交按钮:<input type="submit" value="提交按钮">submit提交按钮,将数据给后端服务器
重置按钮:<input type="reset">
<input type="button" value="普通按钮">
-->
<!-- 5.2button按钮 双标签-->
<!-- <button type="submit">提交按钮</button>
<button type="reset">重置按钮</button>
<button type="button">普通按钮,没有任何功能</button> -->
<!-- 5.3select下拉菜单标签 selected默认选中-->
<!-- <select>
<option>北京</option>
<option>上海</option>
<option>南昌</option>
<option selected>深圳</option>
</select> -->
<!-- 5.4textarea文本域标签 用来写评语-->
<!-- <textarea cols="30" rows="10"></textarea> -->
<!-- 5.5 label标签 让点击文字就可以选中-->
<!-- <label>单选框:<input type="radio" name="one">选项一 </label>
<label><input type="radio" name="one">选项二</label> -->
<!-- 6.语义化标签 -->
<!-- 没有语义得标签div span -->
<!-- <div>11</div> 独占一行标签 -->
<!-- <span>222</span> 可以在一行标签 -->
<!-- HTML5手机端标签 都是独占一行-->
<!-- <header>网页头部</header>
<nav>网页导航</nav>
<footer>网页底部</footer>
<aside>网页侧边栏</aside>
<section>网页区块</section>
<article>网页文章</article> -->
<!-- 7.字符实体 结构:&英文; -->
<!-- 空格 空格 -->
<!-- 1.综合案例 优秀学生表格 -->
<!--
<table border="1" width="500" height="300">
<caption><h3>优秀学生表格</h3></caption>
<header>
<tr>
<th>年级</th>
<th>姓名</th>
<th>学号</th>
<th>班级</th>
</tr>
</header>
<tbody>
<tr>
<td rowspan="2">高三</td>
<td>张三</td>
<td>110</td>
<td>三年级二班</td>
</tr>
<tr>
<td>赵四</td>
<td>120</td>
<td>三年级三班</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>评语</td>
<td colspan="3">你们都优秀</td>
</tr>
</tfoot>
</table> -->
<!-- 2.综合案例.表单 -->
<h1>青春不在,好好读书</h1>
<hr>
<form action="">
昵称:<input type="text" value="请输入昵称">
<br>
<br>
性别:<label><input type="radio" name="sex">男</label> <label><input type="radio" name="sex">女</label>
<br>
<br>
所在城市: <select>
<option>上海</option>
<option>南昌</option>
<option selected>深圳</option>
</select>
<br>
<br>
喜欢的课程:<label><input type="checkbox">java</label>
<label><input type="checkbox">go</label>
<label><input type="checkbox">c</label>
<br>
<br>
个人介绍:<br>
<textarea cols="60" rows="10"></textarea>
<br>
<br>
<h3>我承诺</h3>
<ul>
<li>好好学习</li>
<li>天天向上</li>
<li>认真努力</li>
</ul>
<br>
<br>
<input type="submit" value="免费注册">
<button type="reset">重置</button>
</form>
</body>
</html>