HTML常用标签总结
Posted 知道什么是码怪吗?
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了HTML常用标签总结相关的知识,希望对你有一定的参考价值。
目录
h标题标签
<!--align对齐方式,标题只有1到6的大小-->
<h1 align="left">标题1</h1>
<h2 align="center">标题2</h2>
<h3 align="right">标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
font字体标签
<!--color修改颜色,face修改字体样式-->
<font color="red" face="宋体">字体标签</font>
div、span、p标签
<!--div标签默认独占一行-->
<div>div标签1</div>
<div>div标签2</div>
<!--span标签长度是封装数据的长度-->
<span>span标签1</span>
<span>span标签2</span>
<!--p标签默认上下各空一行-->
<p>p标签1</p>
<p>p标签2</p>
img图片标签
<!--width表示图片的宽,height表示图片的高,border表示图片的边框像素,alt表示图片查找失败显示的内容-->
<img src="图片的路径" width="100" height="100" border="1" alt="图片没有找到"/>
a超链接标签
<!--target设置是从新网页打开还是从当前网页打开,默认是当前网页-->
<a href="http://www.baidu.com">百度</a>
<a href="http://www.baidu.com" target="_self">百度_self</a>
<a href="http://www.baidu.com" target="_blank">百度_blank</a>
ul、ol列表标签
<!--ul无序列表-->
<ul>
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ul>
<!--ol有序列表-->
<ol>
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ol>
table、tr、th标签
<!--tr表示的是行,td表示的是列-->
<!--border设置表格边框-->
<!--align设置对齐方式-->
<!--<b>设置字体加粗-->
<!--cellspacing单元格间距-->
<!--colspan设置跨列,rowspan设置跨行-->
<table cellspacing="10" align="center" border="1" width="300" height="300" >
<tr>
<td align="center"><b>1.1</b></td><!--效果和下面的效果一样<th>-->
<th>1.2</th>
<td>1.3</td>
<td>1.4</td>
<td>1.5</td>
</tr>
<tr>
<td colspan="2" rowspan="2">2.1</td><!--colspan设置跨列,rowspan设置跨行-->
<td>2.2</td>
<td>2.3</td>
<td>2.4</td>
<td>2.5</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
<td>3.3</td>
<td>3.4</td>
<td>3.5</td>
</tr>
</table>
form表单标签
<form action="http://localhost8080" method="get"></form>
iframe内嵌窗口标签
<iframe src="img图片标签.html" width="500" height="500" name="iframe1"></iframe>
link标签
<link rel="stylesheet" type="text/css" href="文件路径">
input标签
<!--根据type属性而实现不同的效果-->
用户名:<input type="text"><br/>
密码:<input type="password">
select下拉列表标签
国籍:
<select name="国籍">
<option>--请选择国籍--</option>
<option selected="selected">中国</option>
<option>日本</option>
<option>韩国</option>
<option>美国</option>
</select><br/>
textarea多行文本框标签
<!--标签中的内容表示默认值-->
<textarea rows="10" cols="20" name="自我评价">默认值</textarea>
综合应用样例
<form action="http://localhost8080" method="get">
<table>
<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>
<input type="radio" name="性别" checked="checked">男<input type="radio" name="性别">女
</tr>
<tr>
<td>兴趣爱好:</td>
<td><input type="checkbox" name="兴趣爱好">java
<input type="checkbox" name="兴趣爱好">C++
<input type="checkbox" name="兴趣爱好">python<br/></td>
</tr>
<tr>
<td>国籍:</td>
<td><select>
<option>--请选择国籍--</option>
<option selected="selected">中国</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" value="重置" align="left"/></td>
<td><input type="submit" value="提交" align="center"/></td>
<!-- <td><input type="file" value="文件"/></td>-->
</tr>
</table>
</form>
以上是关于HTML常用标签总结的主要内容,如果未能解决你的问题,请参考以下文章