1 <p>段落文本</p>2 3 <hx>标题文本</hx> ??????????//x为1-6 ?从1到6字体逐渐增大4 5 <em>需要强调的文本</em> ????// 斜体6 7 <strong>需要强调的文本</strong> //加粗
1 <style> 2 ?3 span{ 4 ?5 ????color:blue; ??//蓝色 6 ?7 } 8 ?9 </style> ??????????10 11 <span>文本</span> //设置单独的样式
1 <q>引用文本</q> ??????????????????????????????????//短文本的引用 2 ?3 <blockquote>引用文本</blockquote> ????????????????//长文本的引用(缩进) 4 ?5 <br> ????????????????????????????????????????????//回车 ??空标签只有一个开始标签,没有结束标签。 6 ?7 ??????????????????????????????????????????//空格 8 ?9 <hr /> ??????????????????????????????????????????//水平横线10 11 <address>XX大街XX号</address> ??????????????//斜体12 13 <code>代码语言</code> ??????????????????????//变小14 15 <pre>语言代码段</pre> ??????????????????????//长代码16
1 <ul> 2 ?3 ??<li>信息</li> 4 ?5 ??<li>信息</li> ?????//信息列表,前面加一个点 · 6 ?7 ???...... 8 ?9 </ul> ???????????????10 11 <ol>12 13 ???<li>信息</li>14 15 ???<li>信息</li> ?????//信息列表,前面加数字序列16 17 ???......18 19 </ol> ????
1 <div>…</div> ????//一个html页面可以看成一个家,而一个div你们可以看<div ?id="版块名称">…</div> ???成家的每个小房间
1 table、tbody、tr、th、td ???????????//表格 2 ?3 ?4 ?5 ?6 ?7 <style type="text/css"> 8 ?9 table tr td,th{border:1px solid #000;} ??????????????????????//为th,td单元格添加粗细为一个像素的黑色边框。10 11 </style> 12 13 14 15 <table summary="本表格记录2012年到2013年库存记录,记录包括U盘和耳机库存量"> ??????//表格简介16 <caption>2012年到2013年库存记录</caption> ?????????????//表格标题17 18 <tr> 19 <th>产品名称 </th>20 <th>品牌 </th>21 <th>库存量(个) </th>22 <th>入库时间 </th>23 </tr>24 <tr>25 <td>耳机 </td>26 <td>联想 </td>27 <td>500</td>28 <td>2013-1-2</td>29 </tr>30 <tr>31 <td>U盘 </td>32 <td>金士顿 </td>33 <td>120</td>34 <td>2013-8-10</td>35 </tr>36 <tr>37 <td>U盘 </td>38 <td>爱国者 </td>39 <td>133</td>40 <td>2013-3-25</td>41 </tr>42 </table>
效果图:
1 <a href="目标网址" target="_blank">click here!</a> ?//在浏览器新的页面里打开2 3 <a href=mailto:邮箱地址 ? cc=抄送地址 ?& 密件抄送地址 & subject=无主题 & body=无内容>
1 <img src = "myimage.gif" alt = "My Image" title = "My Image" />
1 Form表单2 3 <form>4 ???<input type="text/password" name="名称" value="文本" />5 </form>
1 <input ??type="radio/checkbox" ??value="值" ???name="名称" ??checked="checked"/> ???????//文本框输入2 3 <textarea ?rows="行数" cols="列数">文本</textarea> ????????//文本域,支持多行文本输入
1 ????<label>爱好:</label> 2 ????<select> 3 ??????<option value="看书">看书</option> 4 ??????<option selected="selected" value="旅游">旅游</option> 5 ??????<option value="运动">运动</option> 6 ????7 ???<option value="购物">购物</option> 8 ????</select> 9 ?10 11 ????<select multiple="multiple">12 ??????<option value="看书">看书</option> ??//直接打开13 ??????<option value="旅游">旅游</option>14 ??????<option value="运动">运动</option>15 ??????<option value="购物">购物</option>16 ????</select>17 ?18 19 ????<input type="reset" value="确定" ?/>20 ????<input type="reset" value="重置" ?/>
同一组的单选按钮,name 取值一定要一致,比如上面例子为同一个名称“radioLove”,这样同一组的单选按钮才可以起到单选的作用。
html中常见标签的使用
原文地址:https://www.cnblogs.com/superslow/p/8858126.html