<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>hello</title>
</head>
<body>
<!--使用name作为标记-->
<a name="top">顶部</a>
<h1>忘川彼岸</h1>
<!--分割线：hr-->
<hr/>
<h2>忘川彼岸</h2>
<p>佛若不渡</p>
<p>那就由我来渡</p>
佛前跪千年<br/>
未见佛生怜<br/>
<strong>佛前跪千年</strong>
<em>未见佛生怜</em>
<!--注释：ctr|+/-->
<p>空格</p>
空 格空 格空          格
<br/>
><
<br/>
©版权所有<br/>
<!--图像标签：img+tab-->
<img src="../HTML/resources/image/B站头像.jpg" alt="洛的头像">
<br/>
<!--a 标签:a+tab-->
<a href="1.我的第一个html.html">点击我跳转到页面一</a>
<a href="https://www.baidu.com">点击我跳转到百度</a>
<br/>
<!--锚标签-->
<a href="#top">回到顶部</a>
<a href="mailto:1076958631@qq.com">点击联系我</a>
<!--QQ推广-->
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=&site=qq&menu=yes">
<img src="http://wpa.qq.com/pa?p=2:2970206401:53" alt="你好，加我讨论人生。" title="你好，加我讨论人生。"/>
</a>
<!--
ul unordered lists
li list item
ol ordered lists
dl definition lists
dt definition term-->
<!--有序列表-->
<ol>
<li>Java</li>
<li>C/C++</li>
<li>运维</li>
<li>web</li>
<li>Python</li>
</ol>
<hr/>
<!--无序列表-->
<ul>
<li>Java</li>
<li>C/C++</li>
<li>运维</li>
<li>web</li>
<li>Python</li>
</ul>
<hr/>
<!--自定义列表
dt 列表名称
dd 列表内容
应用：公司网站底部
-->
<dl>
<dt>学科</dt>
<dd>Java</dd>
<dd>C/C++</dd>
<dd>运维</dd>
<dd>web</dd>
<dd>Python</dd>
<dt>位置</dt>
<dd>广东</dd>
<dd>重庆</dd>
<dd>河北</dd>
<dd>广西</dd>
<dd>山西</dd>
</dl>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>09表格标签</title>
</head>
<body>
<!--
行 tr rows
列 td
-->
<table border="1px">
<tr>
<td>第一行第一个</td>
<td>第一行第二个</td>
<td>第一行第三个</td>
</tr>
<tr>
<td>第二行第一个</td>
<td>第二行第二个</td>
<td>第二行第三个</td>
</tr>
</table>
<hr/>
<table border="1px">
<tr>
<!-- colspan跨列-->
<td colspan="3">第一行第一个</td>
</tr>
<tr>
<td>第二行第一个</td>
<td>第二行第二个</td>
<td>第二行第三个</td>
</tr>
</table>
<hr/>
<table border="1px">
<tr>
<td>第一行第一个</td>
<td>第一行第二个</td>
<td>第一行第三个</td>
</tr>
<tr>
<!-- rowspan跨行-->
<td rowspan="2">第二行第一个</td>
<td>第二行第二个</td>
<td>第二行第三个</td>
</tr>
<tr>
<td>第三行第二个</td>
<td>第三行第三个</td>
</tr>
</table>
<hr/>
<!-- 居中style="text-align:center"-->
<hr/>
<table border="1px">
<tr>
<td colspan="3">学生成绩</td>
</tr>
<tr>
<td rowspan="2">狂神</td>
<td>语文</td>
<td>100</td>
</tr>
<tr>
<td>数学</td>
<td>100</td>
</tr>
<tr>
<td rowspan="2">秦僵</td>
<td>语文</td>
<td>100</td>
</tr>
<tr>
<td>数学</td>
<td>100</td>
</tr>
</table>
<hr/>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>媒体元素</title>
</head>
<body>
<!--音频和视频-->
<video src="../HTML/resources/video/leave.mp4" controls></video>
<audio src="../HTML/resources/audio/Nostalgic.mp3" controls autoplay></audio>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>页面标签学习</title>
</head>
<body>
<header><h2>网页头部</h2></header>
<section><h2>网页主体</h2></section>
<footer><h2>网页底部</h2></footer>
<iframe src="https://blog.youkuaiyun.com/weixin_43563224?spm=1001.2101.3001.5343" name="hello" frameborder="0" width="1000px" height="800px"></iframe>
<a href="https://www.baidu.com" target="hello">点击跳转至百度</a>
<hr/>
<iframe src="//player.bilibili.com/player.html?bvid=BV1WZ4y157B7&cid=242088489&page=1"
scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true">
</iframe>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录注册</title>
</head>
<body>
<h1>注册</h1>
<!--
表单：form
action:表单提交的位置，可以是网站，也可以是一个请求处理地址
method:post,get 提交方式
post:比较安全，传输大文件（md5加密）
get：url中提交的信息看得到，高效，不安全
-->
<!--<form action="4.页面标签.html" method="get">-->
<form action="4.页面标签.html" method="post">
<!--text:输入文本框
value="他好帅"默认初始值
maxlength="8"最长能写几个字符
size="30"文本框长度
password：密码框-->
<p>名字: <input type="text" name="username" value="admin"></p>
<!-- readonly只读-->
<!-- <p>名字: <input type="text" name="username" value="admin" readonly></p>-->
<!--
placeholder提示信息
required必填
-->
<!-- <p>名字: <input type="text" name="username" placeholder="请输入用户名" required></p>-->
<p>密码: <input type="password" name="pwd"></p>
<!-- hidden隐藏-->
<!-- <p>密码: <input type="password" name="pwd" hidden value="123456"></p>-->
<p>性别:
<input type="radio" value="boy" name="sex"/>男
<!-- disabled禁用-->
<!-- <input type="radio" value="boy" name="sex" disabled/>男-->
<input type="radio" value="girl" name="sex"/>女
</p>
<!--多选框
-->
<!-- crl+d复制黏贴-->
<!--默认选中：checked
-->
<p>爱好:
<input type="checkbox" value="sleep" name="hobby">睡觉
<input type="checkbox" value="code" name="hobby" checked>敲代码
<input type="checkbox" value="sing" name="hobby">唱歌
</p>
<p>按钮:
<input type="button" name="头像" value="点击变长">
<input type="image" src=".../HTMl/resources/image/B站头像.jpg">
</p>
<!--下拉框，列表框
默认选中：selected
-->
<p>国家:
<select name="列表名称">
<option value="选项的值" selected>中国</option>
<option value="选项的值">美国</option>
<option value="选项的值">英国</option>
<option value="选项的值">日本</option>
</select>
</p>
<!--文本域
-->
<p>
<textarea name="textarea" cols="30" rows="10">文本内容</textarea>
</p>
<!-- 文件域
-->
<p>
<input type="file" name="files">
<input type="button" value="上传" name="upload">
</p>
<!-- 邮箱验证
-->
<p>邮箱:
<input type="email" name="email">
<!-- pattern正则表达式
常用正则表达式速查表 https://www.jb51.net/tools/regexsc.htm
-->
<!-- <input type="email" name="email" pattern="">-->
</p>
<p>URL:
<input type="url" name="url">
</p>
<!-- 数字
-->
<p>商品数量:
<input type="number" name="num" max="100" min="0" step="1">
</p>
<!-- 滑块
-->
<p>音量:
<input type="range" name="voice" min="0" max="100">
</p>
<!-搜索框-->
<p>搜索:
<input type="search" name="search">
</p>
<!-- 增强鼠标可用性-->
<p>
<label for="mark">你点我试试</label>
<input type="text" id="mark">
</p>
<!--
点击文字跳转到搜索框
<p>搜索:
<input type="search" name="search" id="mark">
</p>
<p>
<label for="mark">你点我试试</label>
<input type="text">
</p>
-->
<p>
<input type="submit">
<input type="reset" value="清空表单">
</p>
</form>
</body>
</html>
不懂就问：为啥别人有字我字没了
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
