<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的第一个网页</title>
<style><!--设置字体-->
span{color: blueviolet;}
</style>
</head>
<!--
作者:2322296314@qq.com
时间:2021-05-19
描述:
-->
<body>
<div>
<h1>hello world</h1><!--一级标题-->
<p>hahah <!--空格-->
naha<hr /><!--分割线-->
ahaha<br /><!--回车-->
hhahhahahahhahah</p><!--文本-->
</div><!--分区-->
<header>我是<span>头部标签</span></header>
<section>我是区域部分</section>
<footer>我是底部标签</footer>
<aside>我是侧边栏</aside>
<ul><!--没有前后顺序-->
<li>我的第一个列表信息111</li>
<li>2222</li>
<li>333</li>
</ul>
<ol><!--有序列表-->
<li>我的第一个列表信息</li>
<li>前端开发面试心法 </li>
<li>零基础学习html</li>
</ol>
<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fmmbiz.qpic.cn%2Fmmbiz_jpg%2FD94vEUvV9FyMrztfMSicX9mZXo19icGtNNP5mziabuf5kOyibYv6frDRUL0HOl3oYteHO7icniaSEYkr5MQrBYHn0Oicg%2F%3Fwx_fmt%3Djpeg&refer=http%3A%2F%2Fmmbiz.qpic.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1623991529&t=c5c421921e8dab6cb33e3d287a3339ae"
alt="犬夜叉" title="犬夜叉" /><!--添加图片-->
<a href="http://www.m1905.com/mdb/star/3316/" title=点击进入 target="_blank">添加超链接</a>
<a href="https://www.imooc.com" target="_self">a标签有的target属性,代表打开网页的方式。
<!--可选值为”_self和_blank”,默认值为_self,代表在当前页面打开链接,_blank代表在新窗口打开链接。: --></a>
<hr>
<h2>表格标签</h2>
<table border="1">
<caption>我的第一个表格</caption>
<tr> <!--表格的一行-->
<th>一</th><!--表头-->
<th>二</th>
<th>三</th>
</tr>
<tr>
<td>1</td><!--列-->
<td>2</td>
<td>3</td>
</tr>
</table>
<table border="1">
<caption>我的第二个表格</caption>
<thead>
<tr>
<th>成绩</th>
<th>科目</th>
</tr>
</thead>
<tbody>
<tr>
<td>11</td>
<td>22</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>总分</td>
<td>002</td>
</tr>
</tfoot>
</table>
<hr />
<h2>我的第一个表单</h2>
<form method="post" action="save.php">
<label for="username">用户名:</label>
<input type="text" placeholder="请输入" name=="username" id="username" value=""/><!--文本输入框-->
<label for="pass">密码:</label>
<input type="password" name="pass" id="pass" value=""/><!--密码输入框-->
<input type="submit" value="确定" name="submit" />
<input type="reset" value="重置" name="reset" />
</form>
<hr />
<input type="number" /><!--数字-->
<hr />
<input type="url" /><!--网址输入框-->
<input type="email" /><!--邮箱输入框-->
<form method="post" action="save.php">
<label>联系我们</label>
<textarea cols="50" rows="10">输入内容。。。</textarea>
</form>
<hr />
<form>
<label for="email">输入邮箱地址</label>
<input type="email" id="email" placeholder="Enter email" />
</form>
<hr />
<!--单,复选框-->
<form action="save.php" method="post" ><!--radio单选 checkbox复选-->
<label>性别:</label>
<label>男</label>
<input type="radio" value="1" name="gender"/>
<label>女</label>
<input type="radio" value="2" name="gender" />
<hr />
<h2>创建下拉菜单</h2>
<form>
<select>
<option value="读书">读书</option>
<option value="运动">运动</option>
<option value="音乐">音乐</option>
<option value="休息" selected="selected">休息</option><!--默认选择-->
</select>
</form>
<hr />
<h2>提交/重置按钮</h2>
<form method="post" action="sava.php">
<label for="myName">名字:</label>
<input type="text" value="" name="myName" />
<input type="submit" value="提交" name="submitBtn" />
<input type="reset" value="重置" name="resetBtn" />
</form>
</body>
</html>
【前端】HTML 0基础知识点
于 2021-05-21 16:48:03 首次发布