<heml>
<head>
<title>html中各种常用标签</title>
</head>
<body>
<!--body的属性-->
<!--text:设置body中文本的属性
link:设置超链接的颜色
alink:设置超链接光标放上去时的颜色
vlink:设置超链接点击之后的颜色
bgcolor:设置背景颜色
background:设置背景图片,放进去的是个图片路径,图片会被平铺-->
<a name="top" href="#botm">回到底部</a>
<!--段落标签-->
<!--段落标签p在段落与段落之间会有一个明显的空白列,这是段落标签的特点-->
<p>窗前明月光,疑是地上霜.</p>
<p>举头望明月,低头思故乡.</p>
<!--换行标签-->
<!--换行标签,如果只是单纯的换行可以使用换行标签br
使用换行标签的时候不会像段落标签一样出现明显的空白-->
<p>
窗前明月光,疑是地上霜.<br/>
举头望明月,低头思故乡.
</p>
<!--空格标签-->
<!--空格标签,如果想输入多个空格的时候可以使用空格标签 
如果直接打多个空格,则html会直接解析成一个空格-->
<p>
窗前明 月光<br/> <!--这里在编辑的时候虽然有多个空格,但是在运行解析的时候只有一个空格-->
窗前明 月光
</p>
<!--标题标签-->
<!--标题标签,h#,#是从1到6
<P>
<h1>这是一个标题1<h1>
<h2>这是一个标题2<h2>
<h3>这是一个标题3<h3>
<h4>这是一个标题4<h4>
<h5>这是一个标题5<h5>
<h6>这是一个标题6<h6>
</P>
-->
<hr/><!--分割线标签,这里会画出来一条分割线-->
<!--图片标签-->
<!--图片标签,并且可以设置一些图片属性-->
<p>
<img src="images\A110吗.jpg" width="200px" height="250px" border="10px" alt="显示不出来了" title="喂,110吗"/>
</p>
<!--一些转义符-->
<p>
5>3<br/><!--表示5>3-->
3<5<br/><!--表示3<5-->
&&<br/><!--表示&&-->
3<sup>2</sup>+4<sup>2</sup>=5<sup>2</sup><br/><!--sup表示上标-->
3<sub>2</sub>+4<sub>2</sub>=5<sub>2</sub><br/><!--sub表示下标-->
</p>
<b>举头望明月,低头思故乡</b><br><!--b表示黑体-->
<i>举头望明月,低头思故乡</i><br><!--i表示斜体-->
<tt>举头望明月,低头思故乡</tt><br><!--tt表示打印机文本(等宽)-->
<u>举头望明月,低头思故乡</u><br><!--u表示下划线-->
<s>举头望明月,低头思故乡</s><br><!--s表示删除线-->
<!--预定义格式文本:pre与code配合使用,吧文本按远格式输出,一般用来描述代码-->
<pre>
<code>
for(int i=0;i <10 ;i ++)
{
Console.WriteLise(i);
}
</code>
<pre>
<!--marquee标签可以让图片移动
默认从右到左移动
使用属性direction可以设置移动的方向
使用behavior属性设置移动到边缘的时候图片停下来-->
<p>
<marquee direction="right" behavior="slide"><img src="images\A110吗.jpg" width="200px" height="250px" border="10px" alt="显示不出来了" title="喂,110吗"/></marquee>
</p>
<!--A标签的使用-->
<!--1.链接到其他页面-->
<a href="http://www.baidu.com">百度,在当前页面打开</a><!--链接到百度,默认在同一个页面打开-->
<a href="http://www.baidu.com" target="_blank">百度,在新页面打开</a><!--链接到百度,target="_blank">控制在新页面打开-->
<!--2.发送邮件-->
<a href="mailto:[email protected]">点击我发送邮件哟~~~</a>
<!--3.跳转到底部或者跳转到其他界面的A标签处-->
<a name="botm" href="#top">回到顶部</a>
<a name="到碗里去" href="html.html#到碗里来">到碗里去</a>
<!--设置href为#,是超链接的占位符,显示为超链接,但是点击之后那也不去,不过如果页面在底部,会刷新到顶端？？-->
<a href="#">超链接</a>
<!--列表-->
<!--无序列表ul,不显示排序编号
type:square/正方形 circle/空心圆 disk/实心圆-->
<ul type="disk">
<li>星期一我吃龙虾</li>
<li>星期二我吃鲍鱼</li>
<li>星期三我吃鱼翅</li>
<li>星期四我吃康师傅红烧面</li>
<li>星期五我吃老谭酸醋面</li>
<li>星期六我吃康师傅酸辣面</li>
<li>星期日我吃鸡蛋灌饼</li>
</ul>
<!--有序列表ol
type默认为数字,也可以是A/a/I-->
<ol type="A">
<li>星期一我吃龙虾</li>
<li>星期二我吃鲍鱼</li>
<li>星期三我吃鱼翅</li>
<li>星期四我吃康师傅红烧面</li>
<li>星期五我吃老谭酸醋面</li>
<li>星期六我吃康师傅酸辣面</li>
<li>星期日我吃鸡蛋灌饼</li>
</ol>
<!--自定义列表-->
<dl>
<dt>c#基础语法</dt>
<dd>循环结构</dd>
<dd>顺序结构</dd>
<dd>分支结构</dd>
<dd>选择结构</dd>
<dt>面向对象</dt>
<dd>封装</dd>
<dd>继承</dd>
<dd>多态</dd>
</dl>
<!--table标签,在html中,广泛使用表格来对图片和问题等内容进行布局
tr表示一行,td表示一列,th一般用来设置表头,表示粗体加黑居中-->
<!--table标签的属性
width:设置表格的宽度
height:设置表格的高度
border:设置边框的宽度
cellspacing:设置单元格之间的间隙
cellpadding:设置单元格中文本到单元格左侧的距离
bgcolor:设置背景颜色
bordercolor:设置边框颜色
-->
<!--单元格td的相关属性
align:left/right/center,设置水平布局
valign:top/bottom/middle,设置垂直布局
bgcolor:设置背景颜色
width:设置宽度
height:是指高度
colspan:设置跨列
rowspan:设置跨行
-->
<table width="300px" height="160px" border="1px" cellspacing="0px" cellpadding="0px" bgcolor="red" bordercolor="green">
<tr>
<td>话费查询</td>
<td colspan="3">手机充值</td>
</tr>
<tr>
<td rowspan="3" bgcolor="blue" width="80px" height="80px">汇总</td>
<td align="left">新疆</td>
<td align="right">西藏</td>
<td align="center">内蒙古</td>
</tr>
<tr>
<td valign="top">新疆</td>
<td valign="bottom">西藏</td>
<td valign="middle">内蒙古</td>
</tr>
<tr>
<td>新疆</td>
<td>西藏</td>
<td>内蒙古</td>
</tr>
<tr>
<th>新疆</th><!--黑体加粗居中,表示表头-->
<th>新疆</th>
<th>西藏</th>
<th>内蒙古</th>
</tr>
</table>
<!--form表单的操作,表单的作用就是向服务器传输数据
所有的表单操作都要放到form标签中-->
<!--form的一些属性
action:表单提交的服务器地址
method:表单提交的方式,get/post
get:以url,就是一地址栏的方式提交信息
post:以报文的方式提交-->
<!--fieldset与legend:两个标签配合使用,把标签内的内容当做一块处理,并且把legnend标签内的内容当做标题,类似于groupbox
-->
<form action="http://www.baidu.com" method="get" >
用户名:<input type="text" name="txtName"/><br/>
密码:<input type="password" name="txtPwd"/><br/>
<!--单选,如果想要互斥,必须用name为其分组才行-->
<fieldset>
<legend>性别:</legend>
<input type="radio" name="sex">男</input>
<input type="radio" name="sex">女</input>
</fieldset>
<fieldset>
婚姻状况:
<input type="radio" name="marry">未婚</input>
<input type="radio" name="marry">已婚</input>
</fieldset>
<!--多选-->
<fieldset>
<legend>兴趣爱好:</legend>
<input type="checkbox">吃饭</input>
<input type="checkbox">睡觉</input>
<input type="checkbox">打豆豆</input>
</fieldset>
<!--下拉列表-->
<!--size:设置下拉框显示的选项数量,默认为1-->
<select size="2">
<option>安徽</option>
<option>北京</option>
<option>上海</option>
<option>江苏</option>
</select>
<select>
<!--optgroup用来分组-->
<optgroup label="安徽">
<option>合肥</option>
<option>阜阳</option>
<option>马鞍山</option>
<option>芜湖</option>
</optgroup>
<option>北京</option>
<option>上海</option>
<option>江苏</option>
</select>
照片:
<input type="file"></input>
协议:
<textarea cols="60%" rows="20%" disabled="disabled">这里是文本编辑</textarea>
<input type="submit" value="提交"/> <input type="reset" value="重置"/>
</form>
<body>
</html>
<head>
<title>html中各种常用标签</title>
</head>
<body>
<!--body的属性-->
<!--text:设置body中文本的属性
link:设置超链接的颜色
alink:设置超链接光标放上去时的颜色
vlink:设置超链接点击之后的颜色
bgcolor:设置背景颜色
background:设置背景图片,放进去的是个图片路径,图片会被平铺-->
<a name="top" href="#botm">回到底部</a>
<!--段落标签-->
<!--段落标签p在段落与段落之间会有一个明显的空白列,这是段落标签的特点-->
<p>窗前明月光,疑是地上霜.</p>
<p>举头望明月,低头思故乡.</p>
<!--换行标签-->
<!--换行标签,如果只是单纯的换行可以使用换行标签br
使用换行标签的时候不会像段落标签一样出现明显的空白-->
<p>
窗前明月光,疑是地上霜.<br/>
举头望明月,低头思故乡.
</p>
<!--空格标签-->
<!--空格标签,如果想输入多个空格的时候可以使用空格标签 
如果直接打多个空格,则html会直接解析成一个空格-->
<p>
窗前明 月光<br/> <!--这里在编辑的时候虽然有多个空格,但是在运行解析的时候只有一个空格-->
窗前明 月光
</p>
<!--标题标签-->
<!--标题标签,h#,#是从1到6
<P>
<h1>这是一个标题1<h1>
<h2>这是一个标题2<h2>
<h3>这是一个标题3<h3>
<h4>这是一个标题4<h4>
<h5>这是一个标题5<h5>
<h6>这是一个标题6<h6>
</P>
-->
<hr/><!--分割线标签,这里会画出来一条分割线-->
<!--图片标签-->
<!--图片标签,并且可以设置一些图片属性-->
<p>
<img src="images\A110吗.jpg" width="200px" height="250px" border="10px" alt="显示不出来了" title="喂,110吗"/>
</p>
<!--一些转义符-->
<p>
5>3<br/><!--表示5>3-->
3<5<br/><!--表示3<5-->
&&<br/><!--表示&&-->
3<sup>2</sup>+4<sup>2</sup>=5<sup>2</sup><br/><!--sup表示上标-->
3<sub>2</sub>+4<sub>2</sub>=5<sub>2</sub><br/><!--sub表示下标-->
</p>
<b>举头望明月,低头思故乡</b><br><!--b表示黑体-->
<i>举头望明月,低头思故乡</i><br><!--i表示斜体-->
<tt>举头望明月,低头思故乡</tt><br><!--tt表示打印机文本(等宽)-->
<u>举头望明月,低头思故乡</u><br><!--u表示下划线-->
<s>举头望明月,低头思故乡</s><br><!--s表示删除线-->
<!--预定义格式文本:pre与code配合使用,吧文本按远格式输出,一般用来描述代码-->
<pre>
<code>
for(int i=0;i <10 ;i ++)
{
Console.WriteLise(i);
}
</code>
<pre>
<!--marquee标签可以让图片移动
默认从右到左移动
使用属性direction可以设置移动的方向
使用behavior属性设置移动到边缘的时候图片停下来-->
<p>
<marquee direction="right" behavior="slide"><img src="images\A110吗.jpg" width="200px" height="250px" border="10px" alt="显示不出来了" title="喂,110吗"/></marquee>
</p>
<!--A标签的使用-->
<!--1.链接到其他页面-->
<a href="http://www.baidu.com">百度,在当前页面打开</a><!--链接到百度,默认在同一个页面打开-->
<a href="http://www.baidu.com" target="_blank">百度,在新页面打开</a><!--链接到百度,target="_blank">控制在新页面打开-->
<!--2.发送邮件-->
<a href="mailto:[email protected]">点击我发送邮件哟~~~</a>
<!--3.跳转到底部或者跳转到其他界面的A标签处-->
<a name="botm" href="#top">回到顶部</a>
<a name="到碗里去" href="html.html#到碗里来">到碗里去</a>
<!--设置href为#,是超链接的占位符,显示为超链接,但是点击之后那也不去,不过如果页面在底部,会刷新到顶端？？-->
<a href="#">超链接</a>
<!--列表-->
<!--无序列表ul,不显示排序编号
type:square/正方形 circle/空心圆 disk/实心圆-->
<ul type="disk">
<li>星期一我吃龙虾</li>
<li>星期二我吃鲍鱼</li>
<li>星期三我吃鱼翅</li>
<li>星期四我吃康师傅红烧面</li>
<li>星期五我吃老谭酸醋面</li>
<li>星期六我吃康师傅酸辣面</li>
<li>星期日我吃鸡蛋灌饼</li>
</ul>
<!--有序列表ol
type默认为数字,也可以是A/a/I-->
<ol type="A">
<li>星期一我吃龙虾</li>
<li>星期二我吃鲍鱼</li>
<li>星期三我吃鱼翅</li>
<li>星期四我吃康师傅红烧面</li>
<li>星期五我吃老谭酸醋面</li>
<li>星期六我吃康师傅酸辣面</li>
<li>星期日我吃鸡蛋灌饼</li>
</ol>
<!--自定义列表-->
<dl>
<dt>c#基础语法</dt>
<dd>循环结构</dd>
<dd>顺序结构</dd>
<dd>分支结构</dd>
<dd>选择结构</dd>
<dt>面向对象</dt>
<dd>封装</dd>
<dd>继承</dd>
<dd>多态</dd>
</dl>
<!--table标签,在html中,广泛使用表格来对图片和问题等内容进行布局
tr表示一行,td表示一列,th一般用来设置表头,表示粗体加黑居中-->
<!--table标签的属性
width:设置表格的宽度
height:设置表格的高度
border:设置边框的宽度
cellspacing:设置单元格之间的间隙
cellpadding:设置单元格中文本到单元格左侧的距离
bgcolor:设置背景颜色
bordercolor:设置边框颜色
-->
<!--单元格td的相关属性
align:left/right/center,设置水平布局
valign:top/bottom/middle,设置垂直布局
bgcolor:设置背景颜色
width:设置宽度
height:是指高度
colspan:设置跨列
rowspan:设置跨行
-->
<table width="300px" height="160px" border="1px" cellspacing="0px" cellpadding="0px" bgcolor="red" bordercolor="green">
<tr>
<td>话费查询</td>
<td colspan="3">手机充值</td>
</tr>
<tr>
<td rowspan="3" bgcolor="blue" width="80px" height="80px">汇总</td>
<td align="left">新疆</td>
<td align="right">西藏</td>
<td align="center">内蒙古</td>
</tr>
<tr>
<td valign="top">新疆</td>
<td valign="bottom">西藏</td>
<td valign="middle">内蒙古</td>
</tr>
<tr>
<td>新疆</td>
<td>西藏</td>
<td>内蒙古</td>
</tr>
<tr>
<th>新疆</th><!--黑体加粗居中,表示表头-->
<th>新疆</th>
<th>西藏</th>
<th>内蒙古</th>
</tr>
</table>
<!--form表单的操作,表单的作用就是向服务器传输数据
所有的表单操作都要放到form标签中-->
<!--form的一些属性
action:表单提交的服务器地址
method:表单提交的方式,get/post
get:以url,就是一地址栏的方式提交信息
post:以报文的方式提交-->
<!--fieldset与legend:两个标签配合使用,把标签内的内容当做一块处理,并且把legnend标签内的内容当做标题,类似于groupbox
-->
<form action="http://www.baidu.com" method="get" >
用户名:<input type="text" name="txtName"/><br/>
密码:<input type="password" name="txtPwd"/><br/>
<!--单选,如果想要互斥,必须用name为其分组才行-->
<fieldset>
<legend>性别:</legend>
<input type="radio" name="sex">男</input>
<input type="radio" name="sex">女</input>
</fieldset>
<fieldset>
婚姻状况:
<input type="radio" name="marry">未婚</input>
<input type="radio" name="marry">已婚</input>
</fieldset>
<!--多选-->
<fieldset>
<legend>兴趣爱好:</legend>
<input type="checkbox">吃饭</input>
<input type="checkbox">睡觉</input>
<input type="checkbox">打豆豆</input>
</fieldset>
<!--下拉列表-->
<!--size:设置下拉框显示的选项数量,默认为1-->
<select size="2">
<option>安徽</option>
<option>北京</option>
<option>上海</option>
<option>江苏</option>
</select>
<select>
<!--optgroup用来分组-->
<optgroup label="安徽">
<option>合肥</option>
<option>阜阳</option>
<option>马鞍山</option>
<option>芜湖</option>
</optgroup>
<option>北京</option>
<option>上海</option>
<option>江苏</option>
</select>
照片:
<input type="file"></input>
协议:
<textarea cols="60%" rows="20%" disabled="disabled">这里是文本编辑</textarea>
<input type="submit" value="提交"/> <input type="reset" value="重置"/>
</form>
<body>
</html>