HTML中有很多的标签(元素),可以按照这些元素在网页中所占的空间情况进行分类。具体可以这样简单的分类:

1.块级元素:指的是在网页中该元素独自占据网页的一行显示区域,即当使用了该元素后,该元素会使下一个元素在下一行展示,也就是产生换行;根据资料的定义是:标签的display属性值为block;

2.行级元素:指的是网页中该元素不会独自占据网页的一整行区域,使用该元素后,还可以直接在该元素的后面显示另一个元素,也就是不会换行;或者根据资料的定义是:标签的display属性值为inline;

3.行内块元素:这类元素的display=“inline-block”,它们的效果是:同样不会换行,可以直接在后面显示其他的元素。

具体代表:

1.块级元素:

2.行级元素:

3.行内块级元素:

使用小技巧:

1.一般情况下,不要使用行内元素嵌套块级元素;

2.在布局中,可以使用元素的display属性,改变元素的默认类别。例如:将a 元素的display设为block后,可以作为块级元素使用,这样可以让链接和其他的元素一起放在同一个块中。

HTML中的元素分类的更多相关文章

  1. CSS中的元素分类

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

  2. Web前端开发基础 第四课(CSS元素分类)

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

  3. html标签元素分类

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

  4. CSS学习笔记之元素分类

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

  5. HTML标签元素分类(HTML基础知识)

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

  6. React 深入系列1:React 中的元素、组件、实例和节点

    文:徐超,<React进阶之路>作者 授权发布,转载请注明作者及出处 React 深入系列,深入讲解了React中的重点概念.特性和模式等,旨在帮助大家加深对React的理解,以及在项目中 ...

  7. 深入css布局篇(1) — 盒模型 & 元素分类

    深入css布局(1)-- 盒模型 & 元素分类     " 在css知识体系中,除了css选择器,样式属性等基础知识外,css布局相关的知识才是css比较核心和重要的点.今天我们来深 ...

  8. HTML之元素分类(HTML基础知识)

    HTML之元素分类 一.按照块级元素还是行内元素分类 块级元素(block-level)和行内元素(inline-level,也叫作“内联”元素). a.块级元素(独占一行) 块级元素:其最明显的特征 ...

  9. JavaScript中数组元素删除的七大方法汇总

    原文链接:https://blog.csdn.net/u010323023/article/details/52700770 在JavaScript中,除了Object之外,Array类型恐怕就是最常 ...

随机推荐

  1. 几种int类型的范围

    我们在编程的过程经常会遇到数据溢出的情况,于是这个时候我们必须定义能表示更大的数的数据类型来表示这个数. 下面列出了int型的范围: unsigned   int   0-4294967295    ...

  2. 【liferay】5、使用PortletURL进行跨portlet通信 liferay6.2

    [问题] 1.当我们一个页面存在多一个portlet的时候,如在不同的portlet之间传参? [解决办法] 1.在liferay官方有几种方式,比较复杂麻烦,不是太实用,这里不再赘述. 2.通过fr ...

  3. [翻译] Trident-ML:基于storm的实时在线机器学习库

    最近在看一些在线机器学习的东西,看到了trident-ml, 觉得比较有意思,就翻译了一下,方便有兴趣的读者学习. 本文为作者(掰棒子熊)翻译自https://github.com/pmerienne ...

  4. 10-01 Java 类,抽象类,接口的综合小练习--运动员和教练

    运动员和教练的案例分析 运动运和教练的案例 代码实现 /* 教练和运动员案例 乒乓球运动员和篮球运动员. 乒乓球教练和篮球教练. 为了出国交流,跟乒乓球相关的人员都需要学习英语. 请用所学知识: 分析 ...

  5. ThreadLocal是否会引发内存泄露的分析 good

    这篇文章,主要解决一下疑惑: 1. ThreadLocal.ThreadLocalMap中提到的弱引用,弱引用究竟会不会被回收? 2. 弱引用什么情况下回收? 3. JAVA的ThreadLocal和 ...

  6. C++ 操作符、局部 全局变量及自动转换原则

    1.&:表示与操作,eg:2&1=2&&:表示and操作,eg:1&&0=0|:表示或操作,eg:2|1=3||:表示or操作,eg:1||0=12.全 ...

  7. SSH远程连接Ubuntu Server

    Ubuntu默认没有安装openssh-server包,故从远程计算机通过SSH连接时会收到Connection refused的消息. 首先在Ubuntu检查/etc/ssh/sshd_config ...

  8. CRM项目完成实现

    这两天我们都在写项目的接口与实现的! 今天主要是遇到的问题: 当我在添加新的班级的时候,班级的老师 我需要去判断这个老师是否存在,如果不存在的话,我就要把这个老师添加到学校的员工表中! 我会先判断这个 ...

  9. 代理(Proxy)模式 ,桥梁(Bridge)模式

    一:代理模式 1 根据名字我们就可以理解为:代替别人管理 2 什么情况下使用代理模式呢? 在软件系统中,有些对象有时候由于跨越网络或者其他的障碍,而不能够或者不想直接访问另一个对象,如果直接访问会给系 ...

  10. little eye 精简版

    https://github.com/salomon1184/PerfMan/ 代码没整理,特乱 来源于一次聊天,一天半做完,考虑继续深做