<!DOCTYPE html>
<html lang="en"> <!--表示整个html页面的开始-->
<head> <!--头信息-->
<meta charset="UTF-8">
<title>Title</title> <!--标题-->
</head>
<body><!--body是页面的主体内容-->
<!--页面主体内容-->
<p>你好</p>
<br/> <!--换行-->
<hr/> <!--水平线-->
<font color="blue">你好</font> <!--font字体---->
<div>你好</div>
<font color="#dc143c" face="黑体" size="7">我是字体标签</font>
<hr/>
你好<>我好
       <br/> <!-- 空格-->
大家好
<!--标签标题-->
<h1 align="left">标题1</h1>
<h2 align="center">标题2</h2>
<h3 align="right">标题3</h3>
<!--超链接！！！！!-->
<a href="http://www.baidu.com">百度</a>
<a href="http://www.xiaomi.com">小米</a>
<a href="http://www.taobao.com">淘宝</a> <!--超链接 a href-->
<!--列表标签-->
<ul type="none"> <!--ul是无序列表 type属性可以修改列表项前面的符号-->
<li>张三</li> <!--li是列表项-->
<li>李四</li>
<li>王二</li>
</ul>
<!--img标签(可以在html页面上显示图片)-->
<!--1-->
<img src="01.jpg"/>
<img src="./01.jpg"/>
<img src="../PICTURE/02.jpg"/>
<!-- 注意：一个.为当前目录（也可不写直接写文件名）两个.即为上级目录需写文件夹名文件名-->
<!--改变大小-->
<img src="01.jpg" width="200" heigth="150" border="1"/> <!--border为边框粗细 -->
<img src="02.jpg" width="200" heigth="150" border="1" alt="找不到图片"/> <!--alt是未找到图片时提供文本提示-->
<!--表格标签!!!-->
<!--做一个三行三列的表格 并显示边框-->
<!--修改表格的宽高 表格的对齐方式 单元格间距-->
<!-- table
border边框粗细
width表格宽度
height表格宽度
align相对于页面的对齐方式 可为左left 中center 或右right
cellspacing单元格间距
align单元格文本对齐方式
b加粗
-->
<table align="center" border="1" width="300" height="300" cellspacing="0">
<tr> <!--tr行标签-->
<th>1.1</th> <!--th表头标签-->
<th>1.2</th>
<th>1.3</th>
</tr>
<tr>
<td>2.1</td> <!--td单元格标签-->
<td>2.2</td>
<td>2.3</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
<td>3.3</td>
</tr>
</table>
<hr/>
<!--！！！！！跨行跨列表格-->
<!-- 新建一个五行五列的表格
第一行第一列的单元格要跨两列
第二行第一列的单元格要跨两行
第四行第四列的单元格跨两行两列
-->
<table width="300" height="300" border="1" align="center" cellspacing="0">
<tr>
<td colspan="2">1.1</td> <!--colspan属性跨列-->
<td>1.2</td>
<td>1.3</td>
</tr>
<tr>
<td rowspan="2">2.1</td>
<td>2.2</td>
<td>2.3</td>
<td>2.4</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
<td>3.3</td>
</tr>
<tr>
<td>4.1</td>
<td>4.2</td>
<td>4.3</td>
<td colspan="2" rowspan="2">4.4</td>
</tr>
<tr>
<td>5.1</td>
<td>5.2</td>
<td>5.3</td>
</tr>
</table>
<!--iframe框架标签(在html加载一个单独的页面)-->
这是一个单独的完整界面<br/><br/>
<iframe src="01-title.html" width="500" height="400" name="abc"></iframe>
<br/>
<ul>
<li><a href="01-title.html"target="abc">01标签</a></li>
</ul>
<hr/>
<!--表单标签！！！！-->
<!--创建一个个人信息注册表单界面 包含用户名 密码 确认密码 性别（单选） 兴趣爱好（多选） 国籍（下拉列表）
隐藏域 自我评价（多行文本域） 重置按钮 提交按钮-->
<form> <!--form就是表单-->
用户名：<input type="text" value="默认值"/><br/> <!--input type=text 是文本输入框 value设置默认显示内容-->
密码：<input type="password" /><br/> <!--input type=password 是密码输入框-->
确认密码：<input type="password"/><br/>
性别：<input type="radio" name="sex"/>男 <input type="radio" name = "sex"/>女<br/>
<!--input type=radio 是单选框-->
兴趣爱好：<input type="checkbox"/>JAVA <input type="checkbox"/>C++ <input type="checkbox"/><br/>
<!--input type=radio 是复选框-->
国籍：<select>
<option>请选择国籍</option>
<option>中国</option>
<option>美国</option>
<option>加拿大</option>
</select>
自我评价：<textarea rows="10" cols="20" >请输入自我评价...</textarea><br/> <!--textarea表示多行文本输入框 rows高 cols宽-->
<input type="reset" /> <!-- input type=reset 是重置按钮-->
<input type="submit"/> <!-- input type=submit 是提交按钮-->
</form>
<!--对上面表单进行格式化-->
<form action="http://www.baidu.com" method="post">
<!--<input type="hidden" name="action" value="login"..../>-->
<!--action属性设置提交服务器地址
method属性设置提交方式
get（需要格式 不安全 有长度限制）或post（只有action属性值 更安全 理论没有长度限制）
-->
<h1 align="center">用户注册页面</h1>
<table align="center">
<tr>
<td>用户名称：</td>
<td><input type="text" value="默认值"</td>
</tr>
<tr>
<td>密码：</td>
<td><input type="password"</td>
</tr>
<tr>
<td>确认密码：</td>
<td><input type="password"</td>
</tr>
<tr>
<td>性别：</td>
<td><input type="radio" name="sex"/>男
<input type="radio" name="sex"/>女</td>
</tr>
<tr>
<td>国籍：</td>
<td>
<select>
<option>请选择国籍</option>
<option>中国</option>
<option>美国</option>
<option>加拿大</option>
</select>
</td>
</tr>
<tr>
<td>自我评价：</td>
<td><textarea rows="10" cols="20">请输入自我评价</textarea></td>
</tr>
<tr>
<td><input type="reset"/></td>
<td><input type="submit"/></td>
<td><input type="file"/></td>
<!--input type=button 是按钮
input type=file 是文件上传域
input type=hidden 是隐藏域
select 是下拉列表框
option是下拉列表框中的选项
-->
</tr>
</table>
</form>
<hr/>
<!--其他标签-->
<div>div标签1</div> <!--div标签默认独占一行-->
<div>div标签1</div>
<span>span标签1</span> <!--封装数据的长度-->
<span>span标签2</span>
<p>p段落标签1</p> <!--p默认上下方隔空一行-->
<p>p段落标签2</p>
<p>p段落标签3</p>
</body>
</html><!--表示整个html页面的结束-->
06-09
478
478
“相关推荐”对你有帮助么？
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
