HTML 块级元素与行内元素有哪些以及注意、总结
行内元素和块级元素是HTML中的两种元素类型,它们在页面中的显示方式和行为有所不同。
块级元素(Block-level Elements):
常见的块级元素有div、p、h1-h6、ul、ol、li、table、form等。
块级元素会独占一行,即使没有设置宽度,也会自动填充父容器的宽度。
块级元素可以设置宽度、高度、内外边距等属性。
块级元素可以包含其他块级元素和行内元素。
<span style="background-color: red">块级元素</span>

行内元素(Inline Elements):
常见的行内元素有span、a、img、strong、em、input、label等。
行内元素不会独占一行,它会在同一行内根据内容的大小自动排列。
行内元素的宽度和高度由内容决定,不能直接设置宽度和高度属性。
行内元素的内外边距只影响元素自身的排列,不会改变其他元素的位置。
行内元素不能包含块级元素,只能包含其他行内元素或文本内容。
需要注意的是,HTML5中的一些元素可以根据上下文的不同表现出块级元素或行内元素的特性。例如,a标签在默认情况下是行内元素,但如果给a标签设置display: block;属性,它就会变成块级元素。
<p style="background-color: pink">行内元素 </p>

总结:
行内元素和块级元素在页面布局和样式设置上有着不同的表现。块级元素会独占一行,可以设置宽度、高度和内外边距,可以包含其他块级元素和行内元素;行内元素在同一行内根据内容大小排列,不能设置宽度和高度,内外边距只影响元素自身的排列,只能包含其他行内元素或文本内容。
相关文章:
HTML 块级元素与行内元素有哪些以及注意、总结
行内元素和块级元素是HTML中的两种元素类型,它们在页面中的显示方式和行为有所不同。 块级元素(Block-level Elements): 常见的块级元素有div、p、h1-h6、ul、ol、li、table、form等。 块级元素会独占一行,即使没有…...
SpringBoot热部署
SpringBoot热部署 借鉴链接🔗:SpringBoot中的热部署 添加devtools依赖和pom插件 <!-- devtools 依赖 --> <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId&…...
Jmeter入门
一、下载jmeter 官网下载 下载之后解压,在目录/bin下面找到jmeter.bat双击之后即可启动Jmeter。 二、使用 如下左图,选择语言为中文,可以修改测试计划的名称。如下右图,添加线程组 添加线程组 添加http请求 路径传参方式 …...
go集成nacos
1,go集成nacos 注册实例与注销实例 package mainimport ("fmt""github.com/nacos-group/nacos-sdk-go/clients""github.com/nacos-group/nacos-sdk-go/clients/naming_client""github.com/nacos-group/nacos-sdk-go/common/constant"…...
NLP项目实战01--电影评论分类
介绍: 欢迎来到本篇文章!在这里,我们将探讨一个常见而重要的自然语言处理任务——文本分类。具体而言,我们将关注情感分析任务,即通过分析电影评论的情感来判断评论是正面的、负面的。 展示: 训练展示如下…...
Linux vmstat命令:监控系统资源
vmstat命令,是 Virtual Meomory Statistics(虚拟内存统计)的缩写,可用来监控 CPU 使用、进程状态、内存使用、虚拟内存使用、硬盘输入/输出状态等信息。此命令的基本格式有如下 2 种: [rootlocalhost ~]# vmstat [-a…...
php爬虫规则与robots.txt讲解
在进行网页爬虫时,有一些规则需要遵守,以避免违反法律,侵犯网站隐私和版权,以及造成不必要的麻烦。以下是一些常见的PHP爬虫规则: 1. 尊重网站的使用条款:在开始爬取之前,请确保你阅读并理解了…...
Ray使用备注
Ray使用备注 框架介绍 Ray是一种python分布式任务调度框架其支持 无状态的任务并发执行,也支持 有状态的任务按照一定顺序执行其支持 分布式调度器,在一个节点上创建的任务先给本节点的局部调度器,并让本节点自己处理,当资源不够时,再将任务发给全局调度器供其他节点处理其支…...
个人介绍以及毕业去向
CSDN陪伴我从大一到大四,后面也会接着用 写一点大学四年的总结 #总结#理工科#留学 211大学 弃保出国 智能科学与技术 均分88.9 EI论文一篇 数学竞赛和数学建模均为省二 大创评为国家级 全国大学生计算机设计大赛国家三等奖 百度Paddle、大疆RoboMaster、Phytium Te…...
原创度检测,在线文章原创度检测
原创度检测,作为数字时代中内容创作者和学术界广泛关注的话题,正逐渐成为保障知识产权、促进创新发展的不可或缺的工具。今天,我们将深入介绍原创度检测的定义、意义、技术原理、应用领域以及未来趋势。 一、什么是原创度检测? 原…...
windows下安装git中文版客户端
下载git Windows客户端 git客户端下载地址:Git - Downloads 我这里下载的是Git-2.14.0-64-bit.exe版本 下载TortoiseGit TortoiseGit客户端下载地址:Download – TortoiseGit – Windows Shell Interface to Git TortoiseGit客户端要下载两个&#…...
短视频怎么批量添加水印logo
在现代数字化时代,视频内容已经成为我们日常生活中不可或缺的一部分。然而,当我们辛辛苦苦制作的视频在网络上分享时,常常会遇到被他人盗用或未经授权使用的情况。为了保护我们的创作成果,给视频添加水印logo成为了一种常见的手段…...
一文入门 UUID
UUID简介 UUID代表Universally Unique Identifier,译为全局一标识符。它是一种由软件构建的标准化身份验证方案,用于确保跨多个上下文中的对象都具有唯一性。UUID在各种系统之间确保了严格的唯一性,因此即使在大型分布式环境中,也…...
kafka学习笔记--broker工作流程、重要参数
本文内容来自尚硅谷B站公开教学视频,仅做个人总结、学习、复习使用,任何对此文章的引用,应当说明源出处为尚硅谷,不得用于商业用途。 如有侵权、联系速删 视频教程链接:【尚硅谷】Kafka3.x教程(从入门到调优…...
多合一iPhone 解锁工具:iMyFone LockWiper iOS
多合一iPhone 解锁工具 无需密码解锁 iPhone/iPad/iPod touch 上所有类型的屏幕锁定 在几分钟内解锁 iPhone Apple ID、Touch ID 和 Face ID 立即绕过 MDM 并删除 iPhone/iPad/iPod touch 上的 MDM 配置文件 支持所有 iOS 版本和设备,包括最新的 iOS 17 和 iPhone 1…...
在设计和考虑建造室外雨水收集池时需要注意的因素
在设计和建造室外雨水收集池时,需要考虑以下因素: 地质条件:建造雨水收集池需要考虑到地质条件,例如土壤类型、地基承载能力等。这些因素可能对水池的建造和结构产生影响。 气候条件:不同地区的降雨量、湿度、气温等…...
C_5练习题答案
一、单项选择题(本大题共20小题,每小题2分,共40分。在每小题给出的四个备选项中,选出一个正确的答案,并将所选项前的字母填写在答题纸的相应位置上。) 下列叙述中错误的是(D)。A.计算机不能直接执行用C语言编写的源程序 B.C程序经C编译程序编译后,生成扩展名为obj的文件是一个二…...
使用 Axios 进行网络请求的全面指南
使用 Axios 进行网络请求的全面指南 本文将向您介绍如何使用 Axios 进行网络请求。通过分步指南和示例代码,您将学习如何使用 Axios 库在前端应用程序中发送 GET、POST、PUT 和 DELETE 请求,并处理响应数据和错误。 准备工作 在开始之前,请…...
已解决java.lang.exceptionininitializererror异常的正确解决方法,亲测有效!!!
已解决java.lang.exceptionininitializererror异常的正确解决方法,亲测有效!!! 文章目录 报错问题解决思路解决方法交流 报错问题 java.lang.exceptionininitializererror 解决思路 java.lang.ExceptionInInitializerError 是一…...
深度学习 Day10——T10数据增强
🍨 本文为🔗365天深度学习训练营 中的学习记录博客🍖 原作者:K同学啊 | 接辅导、项目定制 文章目录 前言一、我的环境二、代码实现与执行结果1.引入库2.设置GPU(如果使用的是CPU可以忽略这步)3.导入数据4.查…...
谷歌浏览器插件
项目中有时候会用到插件 sync-cookie-extension1.0.0:开发环境同步测试 cookie 至 localhost,便于本地请求服务携带 cookie 参考地址:https://juejin.cn/post/7139354571712757767 里面有源码下载下来,加在到扩展即可使用FeHelp…...
大数据学习栈记——Neo4j的安装与使用
本文介绍图数据库Neofj的安装与使用,操作系统:Ubuntu24.04,Neofj版本:2025.04.0。 Apt安装 Neofj可以进行官网安装:Neo4j Deployment Center - Graph Database & Analytics 我这里安装是添加软件源的方法 最新版…...
STM32+rt-thread判断是否联网
一、根据NETDEV_FLAG_INTERNET_UP位判断 static bool is_conncected(void) {struct netdev *dev RT_NULL;dev netdev_get_first_by_flags(NETDEV_FLAG_INTERNET_UP);if (dev RT_NULL){printf("wait netdev internet up...");return false;}else{printf("loc…...
(二)TensorRT-LLM | 模型导出(v0.20.0rc3)
0. 概述 上一节 对安装和使用有个基本介绍。根据这个 issue 的描述,后续 TensorRT-LLM 团队可能更专注于更新和维护 pytorch backend。但 tensorrt backend 作为先前一直开发的工作,其中包含了大量可以学习的地方。本文主要看看它导出模型的部分&#x…...
2.Vue编写一个app
1.src中重要的组成 1.1main.ts // 引入createApp用于创建应用 import { createApp } from "vue"; // 引用App根组件 import App from ./App.vue;createApp(App).mount(#app)1.2 App.vue 其中要写三种标签 <template> <!--html--> </template>…...
[ICLR 2022]How Much Can CLIP Benefit Vision-and-Language Tasks?
论文网址:pdf 英文是纯手打的!论文原文的summarizing and paraphrasing。可能会出现难以避免的拼写错误和语法错误,若有发现欢迎评论指正!文章偏向于笔记,谨慎食用 目录 1. 心得 2. 论文逐段精读 2.1. Abstract 2…...
涂鸦T5AI手搓语音、emoji、otto机器人从入门到实战
“🤖手搓TuyaAI语音指令 😍秒变表情包大师,让萌系Otto机器人🔥玩出智能新花样!开整!” 🤖 Otto机器人 → 直接点明主体 手搓TuyaAI语音 → 强调 自主编程/自定义 语音控制(TuyaAI…...
关键领域软件测试的突围之路:如何破解安全与效率的平衡难题
在数字化浪潮席卷全球的今天,软件系统已成为国家关键领域的核心战斗力。不同于普通商业软件,这些承载着国家安全使命的软件系统面临着前所未有的质量挑战——如何在确保绝对安全的前提下,实现高效测试与快速迭代?这一命题正考验着…...
Kubernetes 网络模型深度解析:Pod IP 与 Service 的负载均衡机制,Service到底是什么?
Pod IP 的本质与特性 Pod IP 的定位 纯端点地址:Pod IP 是分配给 Pod 网络命名空间的真实 IP 地址(如 10.244.1.2)无特殊名称:在 Kubernetes 中,它通常被称为 “Pod IP” 或 “容器 IP”生命周期:与 Pod …...
Axure 下拉框联动
实现选省、选完省之后选对应省份下的市区...
