行内元素、块级元素、空元素的理解

简介: 行内元素、块级元素、空元素的理解

一、什么是行内元素?块级元素?空元素?


       1)行内元素也称行内标签或内联元素或内嵌元素,一个行内标签通常会和其他行内标签显示在同一行中,它们不占有独立的区域,仅仅靠自身的文本内容大小和图像尺寸来支撑结构,一般不可以设置宽度、高度、对齐等属性,常用于控制页面中文本的样式。


       2)块级元素也称为块标签,在页面中以区域块的形式出现,其特点是,每个块元素通常都会独自占据一行或多行,可以对其设置宽度、高度、对齐等属性,常用于网页布局和网页结构的搭建。


       3)空元素指在html中没有内容的html元素。


二、哪些是行内元素、块级元素、空元素?


       1)常见的行内元素:<strong>、<b>、<em>、<i>、<del>、<s>、<ins>、<u>、<a>、<span>等,其中<span>标签最典型的行内元素。


       2)常见的块级元素:<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等,其中<div>标签是最典型的块元素。


       3)常见的空元素:<br/> 换行 ;<hr> 分隔线 ;<input>文本框;<img> 图片; <link>外链 <meta>。


三、编码中的注意点与实际问题?


       1)行内元素与块级元素的区别:


               a、行内在同一行而不在同一列,块级相反;


               b、块级元素内可以放置行内元素及其他块级元素,相反行内元素不能放置块级元素但可以放置其他行内元素和文字;


               c、行内元素与块级元素属性不同,行内元素设置width无效,height无效(可以设置line-height);


       2)行内元素(inline)与块级元素(block)之间的相互转化:


               a、行内元素转到块级元素:设置display:block;


               b、块级元素转到行内元素:设置display:inline;


       3)实际问题:防止在行内元素时设置宽高度,不生效时应该先检查是否为行内元素,是时先转为块级元素再设置。


相关文章
|
网络协议 虚拟化 网络虚拟化
HP Proliant DL360 G9使用业务网卡登录ILO管理(上)
HP Proliant DL360 G9使用业务网卡登录ILO管理
HP Proliant DL360 G9使用业务网卡登录ILO管理(上)
|
存储 网络协议 安全
CentOS7下搭建Rsyslog Server记录远程主机系统日志
CentOS7下搭建Rsyslog Server记录远程主机系统日志
1150 0
CentOS7下搭建Rsyslog Server记录远程主机系统日志
|
Java 开发工具 对象存储
Aliyun OSS Java SDK超时时间设置
Aliyun OSS Java SDK超时时间设置
16850 0
|
SQL 存储 开发框架
数据库必知词汇:用户定义函数(UDF)
用户定义函数(UDF) 由一个或多个SQL语句组成的子程序,可用于封装代码以便重新使用。通常情况下不将用户限制在定义为SQL语言一部分的内置函数上,而是允许用户创建自己的用户定义函数。
2592 0
|
9月前
|
人工智能 分布式计算 数据处理
云产品评测:MaxFrame — 分布式Python计算服务的最佳实践与体验
阿里云推出的MaxFrame是一款高性能分布式计算平台,专为大规模数据处理和AI应用设计。它提供了强大的Python编程接口,支持分布式Pandas操作,显著提升数据处理速度(3-5倍)。MaxFrame在大语言模型数据处理中表现出色,具备高效内存管理和任务调度能力。然而,在开通流程、API文档及功能集成度方面仍有改进空间。总体而言,MaxFrame在易用性和计算效率上具有明显优势,但在开放性和社区支持方面有待加强。
139 9
|
机器学习/深度学习 TensorFlow 算法框架/工具
深度学习中的正则化技术及其对模型性能的影响
【8月更文挑战第26天】本文将深入探讨深度学习领域中的正则化技术,并分析其如何塑造模型性能。我们将从理论出发,逐步引导读者理解不同正则化方法背后的原理,并通过实例展示它们在实际问题中的应用效果。文章旨在启发读者思考如何在特定的深度学习任务中选择合适的正则化策略,以优化模型的表现。
|
9月前
|
运维 Kubernetes Serverless
阿里云Argo X K8s玩转工作流引擎,实现大规模并行计算
本文基于2024云栖大会田双坤的演讲,介绍了Kubernetes作为云原生操作系统的角色及其在各类任务中的应用,重点探讨了Argo Workflows在Kubernetes上编排并行任务的能力。面对自建Argo Workflows的挑战,如稳定性、成本和安全性等问题,阿里巴巴云推出了全托管的Serverless Argo工作流,提供全托管、免运维、可观测和易集成的特点,显著提升了任务编排的效率和稳定性。适用于数据处理、科学计算、自动驾驶仿真等多个领域。
|
网络协议 安全 Linux
网卡接口跃点数:概念与重要性解析
在计算机网络中,跃点数(Hop Count)是指数据包从源设备传输到目标设备时经过的路由器或网关数量,是衡量路径长度的关键指标。本文详细介绍了跃点数的概念、计算方法及其在网络管理中的重要性,包括性能评估、故障排除、网络优化及路由选择等方面的应用。通过使用traceroute或tracert命令,网络管理员可以轻松获取跃点数信息,并据此优化网络结构,提高数据传输效率和安全性。尽管跃点数是重要指标,但仍需与其他因素结合分析以全面评估网络性能。
|
机器学习/深度学习 人工智能 自然语言处理
算法金 | 一文看懂人工智能、机器学习、深度学习是什么、有什么区别!
**摘要:** 了解AI、ML和DL的旅程。AI是模拟人类智能的科学,ML是其分支,让机器从数据中学习。DL是ML的深化,利用多层神经网络处理复杂数据。AI应用广泛,包括医疗诊断、金融服务、自动驾驶等。ML助力个性化推荐和疾病预测。DL推动计算机视觉和自然语言处理的进步。从基础到实践,这些技术正改变我们的生活。想要深入学习,可参考《人工智能:一种现代的方法》和《深度学习》。一起探索智能的乐趣!
415 1
算法金 | 一文看懂人工智能、机器学习、深度学习是什么、有什么区别!
|
前端开发 容器
CSS布局基础:块级元素、行内元素与行内块元素详解
CSS布局基础:块级元素、行内元素与行内块元素详解
653 0