HTML ，即Hyper Text Markup Language 超文本标记语言；

文本：纯字符，如window中的txt文本

超文本：在纯文本中嵌入样式，图片，音频，视频，链接等内容

HTML的基本结构：

<!DOCTYPE html>

<html>

<head>

<title></title>

</head>

<body>

</body>

</html>

HTML元素类型：

(1)     区块元素：

  1. 每个块级元素都从新的一行开始，并且其后的元素也要另起一行。（一个块级元素独占一行）。
  2. 元素的高度、宽度、行高以及顶和底边距都可设置。
  3. 元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设置了宽度

(2)     内联元素：

  1. 和其他元素都在同一行；
  2. 元素的高、宽、行高以及边距均不可设置
  3. 元素的高、宽均取决于它包含的文字或图片的大小

(3)     内联块：

  1. 和其他元素在同一行；
  2. 元素的高度、宽度、行高及边距可以设置

注意：元素的类型是可以改变的，通过display属性设置。

例如：

以下代码和图片的差别揭露不同类型标签元素之间的区别

<!DOCTYPE html>

<html>

<head>

<meta charset=U"utf-8">

<title></title>

<style>

strong,em,a,img{

display:block;

}

h1,h2,p,hr,ul,ol,dl{

display: inline;

}

</style>

</head>

<body>

<strong>天下无双</strong><strong>天下无双</strong>

<em>海天一线</em><em>海天一线</em>

<h1>永无止尽</h1><h1>永无止尽</h1>

<h2>天涯海角</h2><h2>天涯海角</h2>

<p>越狱</p><p>越狱</p>

<hr><hr>

<a>蓝天白云</a><a>蓝天白云</a>

<img src="C:\Users\ghost\Desktop\html\378463.PNG">

<img src="C:\Users\ghost\Desktop\html\627857834.PNG">

<br><br>

<ul><li>透破天幕</li></ul><ul><li>透破天幕</li></ul>

<ol><li>接下黑暗的幕布</li></ol><ol><li>接下黑暗的幕布</li></ol>

<dl>

<dt>电脑</dt>

<dd>联想</dd>

<dd>惠普</dd>

<dt>手机</dt>

<dd>小米</dd>

<dd>苹果</dd>

</dl>

<details>

<summary></summary>

</details>

<details>

<summary>123</summary>

天涯海角共几何，只为青山缘始终。

</details>

</body>

</html>

未控制样式，各标签的默认显示方式，如图1

　　　　　　　　　　　　　　　　　　图1

是它们的显示样式相反，如图2

　　　　　　　　　　　　　　　　　　图2

HTML的标签元素分类的区别的更多相关文章

  1. HTML标签元素分类（HTML基础知识）

    HTML标签元素分类 一.按照块级元素还是行内元素分类 块级元素(block-level)和行内元素(inline-level,也叫作"内联"元素). a.块级元素(独占一行) 块 ...

  2. html标签元素分类

    元素分类 html中的标签元素大体分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1>...&l ...

  3. CSS html标签元素分类

    在CSS中,html中的标签元素大体被分为三种不同的类型: 块状元素.内联元素(又叫行内元素)和内联块状元素.  常用的块状元素有: <div>.<p>.<h1>… ...

  4. CSS中html的标签元素分类

    在CSS中,html中的标签元素大体被分为三种不同的类型: 块状元素.内联元素(又叫行内元素)和内联块状元素.    常用的块状元素有:  <div>.<p>.<h1&g ...

  5. CSS元素分类及区别

    元素是文档结构的基础,在CSS中,每个元素生成了一个包含了元素内容的框(box,也译为“盒子”).但是不同的元素显示的方式会有所不同,例如<div>和<span>就不同,而&l ...

  6. [转]HTML标签元素的分类

      在讲解CSS布局之前,我们需要提前知道一些知识,在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素和内联块状元素. 常用的块状元素有: <div>.<p ...

  7. 04. H5标签有哪些？行内元素有哪些？块级元素有哪些？空(void)元素有哪些？行内元素和块级元素有什么区别？你工作中常用标签有什么？

    4. H5标签有哪些? 2)行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 3)块级元素有哪些? add ...

  8. 从a标签为什么不能包含div标签-了解HTML5元素分类与内容模型

    我们知道按新的 HTML 规范,已经不按 inline 和 block 来区分元素类型了.所以我们在a标签里面使用div标签时候会发现a标签并不能通过改变css盒子模型的方式将div元素包含. 元素分 ...

  9. 了解HTML 元素分类

    HTML中包含大量的标签, 这些标签在我们使用中发现会有小小的差别, 有的标签用了之后不会有太大的布局变化, 只是语义化, 而有的标签却会重起一行, 相当于自己回车了一次, 这就是不同标签元素的分类不 ...

随机推荐

  1. python函数式编程，性能，测试，编码规范

    这篇文章主要是对我收集的一些文章的摘要.因为已经有很多比我有才华的人写出了大量关于如何成为优秀Python程序员的好文章. 我的总结主要集中在四个基本题目上:函数式编程,性能,测试,编码规范.如果一个 ...

  2. 文件的上传和下载--SpringMVC

    文件的上传和下载是项目开发中最常用的功能,例如图片的上传和下载.邮件附件的上传和下载等. 接下来,将对Spring MVC环境中文件的上传和下载进行详细的讲解. 一．文件上传 多数文件上传都是通过表单 ...

  3. BP神经网络算法推导

    目录 前置知识 梯度下降法 激活函数 多元复合函数求偏导的相关知识 正向计算 符号定义 输入层 隐含层 输出层 误差函数 反向传播 输出层与隐含层之间的权值调整 隐含层与输入层之间权值的调整 计算步骤 ...

  4. linux压缩相关

    tar命令 tar是打包,即把好多东西放在一个大文件里面,之后再压缩:当然也可以解包 tar的几个参数说明: -c 创建一个新的包 -x 将包里的文件还原出来 -t 显示包内文件的列表 -f 指定要处 ...

  5. 自制session

    原理 1.面向对象中通过索引的方式访问对象,需要内部实现 __getitem__ .__delitem__.__setitem__方法 2.Tornado框架中,默认执行Handler的get/pos ...

  6. Java-URLEncoder.encode 什么时候才是必须的

    当你希望把一段 URL 当成另一个 URL 的参数时,比如:当用户点击交易的按钮时你发现未登录就跳转到 login 页面同时带上一个参数记录在登录之前用户是希望访问的那个交易页面,这样在登录完成之后再 ...

  7. Servlet各版本web.xml的头文件配置模板

    原文: http://www.codeweblog.com/servlet%E5%90%84%E7%89%88%E6%9C%ACweb-xml%E7%9A%84%E5%A4%B4%E6%96%87%E ...

  8. Final发布文案+美工

    团队名称:探路者 1蔺依铭:http://www.cnblogs.com/linym762/(组长) 2张恩聚:http://www.cnblogs.com/zej87/ 3米赫:http://www ...

  9. 2017-2018-2 1723 『Java程序设计』课程 结对编程练习_四则运算

    一.结对对象 姓名:侯泽洋 学号:20172308 担任角色:驾驶员(侯泽洋) 伙伴第一周博客地址 二.本周内容 1.程序需求 (1).自动生成题目 可独立使用(能实现自己编写测试类单独生成题目的功能 ...

  10. 第二阶段Sprint6

    昨天:设置统一保存路径为内存卡,实现可以选择播放已有的视频 今天:将“录制”及“保存”整合到一起,修复出现的Bug,使之能够正常运行. 遇到的问题:感觉调的摄像头录制的画面不好,这怎么办啊?