1 <!--编写HTML常用的标签 2 文字版面的编辑 3 格式标签 4 文本标签 5 超链接和锚点 6 图像和图像地图 7 --> 8 9 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 10 <html xmlns="http://www.w3.org/1999/xhtml"> 11 <head> 12 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 13 <title>格式标签</title> 14 </head> 15 16 <body> 17 <!--格式标签用于网页中文本的布局、缩进、位置、换行、列表等 18 <br> 换行 19 <p> 段落 20 <center> 居中 21 <pre> 保留文字在源代码中的格式 22 <ul><li> 无序列表 23 <ol><li> 有序列表 24 <hr> 水平分割线--> 25 aaaaaa aaaaaa<br /> 26 bbbbbbbbbbbb<br /> 27 cccccccccccc<br /> 28 <hr> 29 <p>aaaaaaaaaaa</p> 30 <p style="color:blue">bbbbbbbbbbb</p> 31 <p align="center">ccccccccccc</p> 32 <hr /> 33 <center>居中文字</center> 34 <hr /> 35 <pre>aaaa bbbb cccc ddddd eeeee fffff gggg hhhhh yyyyy </pre> 36 <hr /> 37 <ul> 38 <li>内容一 39 <ul> 40 <li>列表项</li> 41 <li>列表项</li> 42 <li>列表项</li> 43 <li>列表项</li> 44 </ul> 45 </li> 46 <li>内容二 47 <ul> 48 <li>列表项</li> 49 <li>列表项</li> 50 <li>列表项</li> 51 <li>列表项</li> 52 </ul> 53 </li> 54 <li>内容三 55 <ul> 56 <li>列表项</li> 57 <li>列表项</li> 58 <li>列表项</li> 59 <li>列表项</li> 60 </ul> 61 </li> 62 </ul> 63 <hr width="600" size="20" noshade="noshade"> 64 <hr width="80%" size="20" noshade="noshade" color="#000000"> 65 <ol> 66 <li>内容一 67 <ol> 68 <li>列表项</li> 69 <li>列表项</li> 70 <li>列表项</li> 71 <li>列表项</li> 72 </ol> 73 </li> 74 <li>内容二 75 <ol> 76 <li>列表项</li> 77 <li>列表项</li> 78 <li>列表项</li> 79 <li>列表项</li> 80 </ol> 81 </li> 82 <li>内容三 83 <ol> 84 <li>列表项</li> 85 <li>列表项</li> 86 <li>列表项</li> 87 <li>列表项</li> 88 </ol> 89 </li> 90 </ol> <!--文本标签在网页中，为了着意强调某一部分文字，或者为了让文字有所变化 91 <hn>（n为1~6） 标题文字 92 <b> 粗体 93 <i> 斜体 94 <u> 下划线 95 <font> 96 <tt> 97 <cite> 98 <em> 99 <strong> 100 <small> 101 <sub> 102 <sup> 103 --> 104 <h1>使用<H1>输出一号标题字体</h1> 105 <h2>使用<H2>输出二号标题字体</h2> 106 <h3>使用<H3>输出三号标题字体</h3> 107 <h4>使用<H4>输出四号标题字体</h4> 108 <h5>使用<H5>输出五号标题字体</h5> 109 <h6>使用<H6>输出六号标题字体</h6> 110 111 <b>粗体</b> 112 <u>下划线</u> 113 <i>斜体</i><br /> 114 115 <font face="楷体_GB2312" color="red" size="5">绝对字体大小为5的红色楷体字</font><br /> 116 <font face="宋体" color="green" size="+3">相对字体大小为+3的绿色字体</font><br> 117 <font face="黑体" color="blue" size="-1">相对字体为-1的蓝色黑体字</font><br /> 118 119 <tt>输出打印文字</tt><br /> 120 <cite>输出引证、举例的斜体字</cite><br /> 121 <em>输出强调的斜体字</em><br /> 122 <strong>输出强调的粗体字</strong><br /> 123 <small>输出小型字体</small><br /> 124 <big>输出大型字体</big><br /> 125 126 127 128 <!--超链接标签--> 129 <a href="../1/1.html">1.html网页</a> 130 <br /> 131 132 <!--锚点标签 133 <a href="URL">某某页面</a>:超链接 134 <a name="name">内容</a>:锚点 135 使用时<a href="#name">定位位置</a> 136 --> 137 <a href="#one">第一段</a> 138 <a href="#two">第二段</a> 139 <a href="#three">第三段</a> 140 <br /> 141 <a name="one"> 142 aaaaaaaaa<br /> 143 aaaaaaaaa<br /> 144 aaaaaaaaa<br /> 145 </a><br /> 146 <a href="#">返回</a> 147 <a name="two"> 148 bbbbbbbbbb<br /> 149 bbbbbbbbbb<br /> 150 bbbbbbbbbb<br /> 151 </a><br /> 152 <a href="#">返回</a> 153 <a name="three"> 154 cccccccccc<br /> 155 cccccccccc<br /> 156 cccccccccc<br /> 157 </a> 158 <a href="#">返回</a> 159 <br /> 160 161 <!--图像标签 162 <img> 163 src:指定图片所在的URL 164 border：边框的宽度 165 alt：1.鼠标放上去有黄色小图标。2.如图片不存在，则出现它指定的文字。3.搜索引擎可以通过它指定的文字搜索该图片 166 width：宽度 167 height：高度 168 --> 169 <a href="../2/2.html"><img src="../1/logo.gif" border="0" width="300" alt="geshi_logo"/></a><br /> 170 171 <!--图片地图 172 一个图像只能加一个a标签，做一个链接。 173 如果把一副图像分成多个区域，每个区域指向不同的URL地址（为图片加多个链接） 174 在图像标签<img>中使用usemap属性去使用地图热点 175 <map>定义热点区域 176 <area>指定每个热点区域 177 shape指定形状rect（矩形）、poly（多边形）、circle（圆形） 178 coords确定形状 179 href指定链接的位置 180 --> 181 <img src="../1/logo.gif" usemap="#mymap" border=0 /> 182 183 <map name="mymap"> 184 <area shape="rect" coords="5, 5, 50, 70" href="../1/1.html" target="_blank"> 185 <area shape="circle" coords="75, 35,30" href="../2/2.html" target="_blank"> 186 <area shape="poly" coords="175,0,110,70, 180,70" href="#" target="_blank"> 187 </map> 188 </body> 189 </html>