• 1，列表相关标签

<ul>：定义无序列表，只能包含<li>子元素

<ol>：定义有序列表，只能包含<li>子元素，因为这个标签是有序的，所有这个标签还有2个属性，start和type。

start：指定列表项的起始数字，默认是第一个

type：指定使用哪种类型的编号。1，代表使用数字，A和a代表使用字母，I和i代表使用罗马数字

<li>：定义列表项目。

<dl>：定义列表

<dt>：定义标题列表项

<dd>：定义普通列表项。值得注意的是这个标签里面可以放好多的东西，可以包含和<div>完全类似的内容



以下是一份包含上面各个标签的html:

 

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>列表相关标签</title>
  5. </head>
  6.  
  7. <body>
  8. 	<ul>
  9. 		<li>这里是无序列表1</li>
  10. 		<li>这里是无序列表2</li>
  11. 		<li>这里是无序列表3</li>
  12. 	</ul>
  13. 	<ol start="3" type="A">
  14. 		<li>这里是有序列表1</li>
  15. 		<li>这里是有序列表2</li>
  16. 		<li>这里是有序列表3</li>
  17. 	</ol>
  18. 	<dl>
  19. 		<dt>这里是标题1</dt>
  20. 		<dd>这里是内容1</dd>
  21. 		<dd>这里是内容2</dd>
  22. 		<dt>这里是标题2</dt>
  23. 		<dd>这里是内容3</dd>
  24. 		<dd>这里是内容4</dd>
  25. 	</dl>
  26. </body>
  27. </html>

  • 2，图像相关标签

html提供了<img />用来在页面中定义图像，这个元素只能是一个空元素，它不可以包含任何内容。使用这个元素必须指定以下2个内容，src和alt。

src：用于指定图片所在的位置，可以是相对路径，也可以是绝对路径

alt：用于指定一段文本，表示该图片的提示信息。

此外，还可以为这个元素指定height和width，用来表示高度和宽度，可以是百分比，也可以是像素值。

另外的还有2个标签，<map>：用于定义图像映射，<area>：用于定义图像映射的内部区域。<bgsound>：插入声音，<embed>：插入视频。一般都用不到，就不做赘述了。



以下是一份包含上面标签的html：

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>图像相关标签</title>
  5. </head>
  6.  
  7. <body>
  8. 	<img alt="Nightwish..." src="img/nightWish.jpg">
  9. 	<a href="http://wwww.baidu.com">
  10. 		<img alt="Nightwish..." src="img/nightWish.jpg">
  11. 	</a>
  12. </body>
  13. </html>

  • 3，表格相关标签

<table>：定义表格。这个元素只能包含0个或者1个<caption>，0个或者1个<thead>，0个或者1个<tfoot>，多个<tr>，多个<tbody>。

另外它还有如下属性：

align：表格自身对齐方式，left，right，center

bgcolor：表格的背景色

border：表格边框的宽度，该值是一个整数，0表示表格无边框

cellpadding：用于指定单元格内容和单元格边框之间的间距

cellspacing：指定单元格之间的间距

width：指定表格的宽度

<caption>：定义表格标题

<tr>：用于定义表格的行，只能包含<td>或者<th>

<td>：用于定义单元格

这个标签要多说几句，经常用到的2个属性：

colspan：用于指定该单元格跨多少列

rowspan：用于指定该单元格可以跨多少行

<th>：用于定义表格页眉的单元格，和<td>用法基本一样

<tbody>：表格的主体，只能包含<tr>

<thead>：表格的页头，和<tbody>用法类似

<tfoot>：表格的页脚，和<tbody>用法类似



以下是包含上面标签的一份html:

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>表格相关标签</title>
  5. </head>
  6.  
  7. <body>
  8. 	<table border="0">
  9. 		<caption>表格1</caption>
  10. 		<tr>
  11. 			<th>乐队</th>
  12. 			<th>国家</th>
  13. 		</tr>
  14. 		<tr>
  15. 			<td>LinkinPark...</td>
  16. 			<td>美国</td>
  17. 		</tr>
  18. 		<tr>
  19. 			<td>NightWish...</td>
  20. 			<td>芬兰</td>
  21. 		</tr>
  22. 	</table>
  23.  
  24. 	<table border="1" align="center" width="500">
  25. 		<caption>表格2</caption>
  26. 		<tr>
  27. 			<td rowspan="2">跨2行的单元格</td>
  28. 			<td title="这里是提示">普通的单元格1</td>
  29. 			<td>普通的单元格2</td>
  30. 		</tr>
  31. 		<tr>
  32. 			<td colspan="2">跨2列的单元格</td>
  33. 		</tr>
  34. 	</table>
  35.  
  36. 	<table border="1" align="right" width="900">
  37. 		<caption>表格3</caption>
  38. 		<thead>
  39. 			<tr>
  40. 			<th>乐队</th>
  41. 			<th>国家</th>
  42. 			</tr>
  43. 		</thead>
  44. 		<tfoot>
  45. 			<tr>
  46. 			<td colspan="2">这里一般用来做统计</td>
  47. 			</tr>
  48. 		</tfoot>
  49. 		<tbody>
  50. 			<tr>
  51. 			<td>LinkinPark...</td>
  52. 			<td>美国</td>
  53. 		</tr>
  54. 		<tr>
  55. 			<td>NightWish...</td>
  56. 			<td>芬兰</td>
  57. 		</tr>
  58. 		</tbody>
  59. 	</table>
  60. </body>
  61. </html>

  • 4，框架相关标签

通过使用框架，可以将浏览器分成几个不同的部分，然后在同一个浏览器窗口里面显示不同的XHTML页面。

如果要在html中使用框架，就应该在该html页面中使用Frameset的DTD，而且这个页面的<html>不允许包含<body>元素。

<frameset>：定义一个框架集，用于包含其他的框架

<frame>：用于定义框架集中的一个框架，这是一个空元素。src属性指定加载那个页面。

<iframe>：生成一个内联框架，可以放在html页面上的任意的位置。

对于框架的这几个相关的标签，值得注意的是不要在框架集页面中过多的使用框架，这种分割面板很耗性能的。

以下是包含上面标签的html页面：

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>框架相关标签</title>
  5. </head>
  6.  
  7. <body>
  8. 	<iframe src="Park.html"></iframe>
  9. </body>
  10. </html>
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>Park.html</title>
  5.  
  6. </head>
  7.  
  8. <body>
  9. 	<h1>这里是另外的一个页面</h1>
  10. 	<hr />
  11. 	<h1>这里是另外的一个页面</h1>
  12. 	<hr />
  13. 	<a name="linkin">这里定义了一个锚点</a>
  14. </body>
  15. </html>

四、Html常用标签的更多相关文章

  1. HTML学习笔记（四）常用标签

    1.超链接 <a href="url">Link text</a> eg:<a href="http://www.w3school.com. ...

  2. HTML的怎么使用，开发工具以及常用标签。

    前端学习:学习地址:黑马程序员pink老师前端入门教程,零基础必看的h5(html5)+css3+移动,下面这些都是一些学习笔记.临渊羡鱼,不如退而结网!!愿我自己学有所成,也愿每个前端爱好者学有所成 ...

  3. CSS常用标签

    CSS常用标签 一 CSS文字属性 color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; / ...

  4. 9月5日网页基础知识 通用标签、属性（body属性、路径、格式控制） 通用标签（有序列表、无序列表、常用标签）（补）

    网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...

  5. Struts2常用标签

    Struts2常用标签总结 一 介绍 1．Struts2的作用 Struts2标签库提供了主题.模板支持,极大地简化了视图页面的编写,而且,struts2的主题.模板都提供了很好的扩展性.实现了更好的 ...

  6. jsp学习--JSP运行原理,九大隐式对象和JSP常用标签

    一.JSP运行原理 每个JSP 页面在第一次被访问时,WEB容器都会把请求交给JSP引擎(即一个Java程序)去处理.JSP引擎先将JSP翻译成一个_jspServlet(实质上也是一个servlet ...

  7. 转--Android按钮单击事件的四种常用写法总结

    这篇文章主要介绍了Android按钮单击事件的四种常用写法总结,比较了常见的四种写法的优劣,有不错的参考借鉴价值,需要的朋友可以参考下     很多学习Android程序设计的人都会发现每个人对代码的 ...

  8. JSTL与EL常用标签（转）

    JSTL与EL EL相关概念 JSTL一般要配合EL表达式一起使用,来实现在jsp中不出现java代码段.所以我们先来学习EL表达式 EL主要用于查找作用域中的数据,然后对它们执行简单操作:它不是编程 ...

  9. HTML5常用标签总结

    一.常用的标签 <h1>~<h6> 表示是一个标题 <p> 段落标签 <hr/> 水平线标签 <br/> 换行标签 <sub> ...

  10. 第2天：HTML常用标签

    今天学完主要对所学知识点进行了整理. 一.超链接ahref:www.baidu.com(跳转页面):id名(锚点跳到相应div位置):01.rar(压缩包) target:_blank(新窗口打开): ...

随机推荐

  1. adb 获取Android手机信息命令(1)

    @set version=1.7.2Normal @echo ============================================================= @echo I ...

  2. git命令记录

    1, clone 远程分支 git clone 命令默认的只会建立master分支,如果你想clone指定的某一远程分支(如:dev)的话,可以如下: A. 查看所有分支(包括隐藏的)  git br ...

  3. jsp数据

    ---恢复内容开始--- JSP 是什么 JSP全称Java Server Pages,是一种动态网页开发技术.它使用JSP标签在HTML网页中插入Java代码.标签通常以<%开头以%>结 ...

  4. django 项目中遇到的问题（持续更新中）

    问题1:in include 'provide the namespace argument to include() instead 描述:在最外层的urls.py 添加项目的urls后报错,错误显 ...

  5. Lua和C的语法差别

    没有main函数 Lua是脚本语言,没有固定入口的main函数.当lua解析器解析某个lua代码文件时,lua解析器一样一行的解析lua脚本. print("Hello lua") ...

  6. VS如何设置类或函数前不显示引用的数量

    问题如下: 取消显示这个引用的步骤: 找到菜单栏: 工具 ---> 选项  ---> 文本编辑器 ---> 所有语言 ---> CodeLens 设置取消启用CodeLens, ...

  7. Android之Bmob移动后端云服务器

    源码下载:http://download.csdn.net/download/jjhahage/10034519 PS:一般情况下,我们在写android程序的时候,想要实现登录注册功能,可以选择自己 ...

  8. CSS属性：定位属性（图文详解）

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. CSS的定位属性有三种,分别是绝对定位.相对定位.固定定位. posit ...

  9. 借助Redis做秒杀和限流的思考

    最近群里聊起秒杀和限流,我自己没有做过类似应用,但是工作中遇到过更大的数据和并发. 于是提出了一个简单的模型: var count = rds.inc(key); if(count > 1000 ...

  10. java自定义注解知识实例及SSH框架下，拦截器中无法获得java注解属性值的问题

    一.java自定义注解相关知识 注解这东西是java语言本身就带有的功能特点,于struts,hibernate,spring这三个框架无关.使用得当特别方便.基于注解的xml文件配置方式也受到人们的 ...