HTML常用标签
1.锚点链接
2.分割线<hr>
3.文字的显示效果
4.文字的布局
5.图片
6.表格
7.表单
■ form标签
■ 其它标签
8.框架
■ frameset
■ iframe
9.邮件链接
<body> <a name="t">anthor</a> <br /> <br /> .... <a href="#t">link</a> </body>
2.分割线<hr>
<hr noshade="noshade" c color="blue" width="300" size="2" align="center" />
3.文字的显示效果
<b>黑体</b> <i>斜体</i> <u>上划线</u> <s>下划线</s> <sup>上标</sup> <sub>下标</sub>
4.文字的布局
<p>分段显示</p> <div>分层显示</div> <span>分块显示</span> <ul> <li type="disc">符号列表</li> </ul> <ol> <li>数字列表</li> </ol> <pre>保持原有格式</pre>
5.图片
<img src="../images/01.jpg" alt="图片" border="1" />
6.表格
<table width="780" align="center" border="2"> <tr> <!-- 宽度设定一次下面的就不用设置了 --> <td width="30%" align="center">A</td> <td width="30%" align="center">B</td> <td align="center">C</td> </tr> <!-- 设定一个格的高度下面的td就跟着变了 --> <!-- valign是垂直对齐显示，相对于Y轴 --> <tr> <td height="50" valign="top">D</td> <td>E</td> <td valign="bottom">F</td> </tr> <tr> <td rowspan="2" colspan="2">我是小霸王</td> <td>我只有一个td了</td> </tr> <tr> <td>我也只有一个td了</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> </table>
7.表单
■ form标签
<!-- Get:发送较少数据(256byte), 显示在url中, url/userinfo?username=apq&password=123--> <!-- Post:数据长度无限制，不会显示在url中--> <form action="01.jsp" method="post"> </form>
■ 其它标签
<form action="01.jsp" method="post"> <!-- 输入框 --> <input type="text" name="username" size="20" maxlength="10" /> <!-- 密码框 --> <input type="password" name="pw" size="20" maxlength="10" /> <!-- 单选按钮 --> <!-- 用法: 同一个name不同的value --> <input type="radio" name="sex" value="male" checked="checked" />男 <input type="radio" name="sex" value="female"> 女 <!-- 多选按钮 --> <input type="checkbox" name="fruit" value="apple" checked="checked" />apple <input type="checkbox" name="fruit" value="pear"/>pear <!-- 按住ctrl键多选 --> <select name="fruit" size="8" multiple="multiple"> <option value="apple" selected="selected">apple</option> <option value="pear">pear</option> </select> <!-- 下拉条 --> <select name="province"> <option value="0" selected="selected">请选择</option> <option value="ln">辽宁</option> <option value="bj">北京</option> </select> <!-- textarea --> <textarea name="text" rows="10" cols="80" wrap="hard"></textarea> <!-- 提交 重置 按钮 --> <input type="submit" value="提交" /> <input type="reset" value="重置" /> <input type="button" value="按钮" /> <!-- 隐藏域 --> <input type="hidden" name="fruit" value="apple" /> </form>
8.框架
■ frameset
<title>A</title> </head> <!-- 注意:不要有body标签 --> <frameset cols="20%, *" framespacing="20"> <frame name="left" src="B.html" noresize scrolling="auto" frameborder="0" /> <frame name="right" src="C.html" frameborder="0" /> </frameset> <!-- 对不支持框架的浏览器提示 --> <noframes> <body>本页面不支持框架显示</body> </noframes> </html>
<title>B</title> </head> <body bgcolor="#CCCCCC"> <p>B</p> </body> </html>
<title>C</title> </head> <frameset rows="40%, *" framespacing="10"> <frame name="righttop" src="C_01.html" frameborder="0" /> <frame name="rightbottom" src="C_02.html" frameborder="0" marginwidth="30" marginheight="30" /> </frameset> <!-- 对不支持框架的浏览器提示 --> <noframes> <body>本页面不支持框架显示</body> </noframes> </html>
<title>C_01</title> </head> <body bgcolor="#CCCCCC"> <p>C_01</p> </body> </html>
<title>C_02</title> </head> <body bgcolor="#CCCCCC"> <a href="B.html">链接到B</a> <br /> <a href="C_01.html">链接到C_01</a> <br /> <a href="B.html" target="righttop">链接到B, 在右上窗口显示</a> <br /> <a href="B.html" target="_parent">链接到B, 在父窗口显示(C.html)</a> <br /> <a href="B.html" target="_top">链接到B, 在顶层窗口显示</a> <br /> <a href="B.html" target="_blank">链接到B, 在新窗口显示</a> </body> </html>
■ iframe
<iframe src="u.html" name="w">hhh</iframe> <br /><br /> <a href="anthor.html" target="w">AAA</a>
9.邮件链接
<a href="mailto:[email protected]?subject=请给我留言">给我写邮件</a>