设置height:100%不生效的原因

之前网课案例总是不屑于去看,因为总觉得太花时间,但是不可否认的是,认真去看还是会有收获的,而且常有意外收获

昨天在看实现动画效果的综合案例中,意外解决了我长久以来的一个疑问:为什么给元素设置height:100%不生效?

样式不生效原因

给元素设置height:100%,元素的高度会变成父元素的100%

如果元素高度未生效,很有可能父元素的高度是0,导致子元素的高度也是0

案例

例如,在一个html骨架中,我给body添加了height:100%,但是打开浏览器审查元素时发现,body的高度居然是0

而body的父元素是html,审查元素发现,html的高度也是0

解决方案

超级easy,将html的高度也设为100%就好啦

html {height: 100%;}

再次打开浏览器,body的高度就生效啦

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/840838.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

java在类的定义中创建自己的对象?

当在main方法中新建自身所在类的对象,并调用main方法时,会不断循环调用main方法,直到栈溢出 package com.keywordStudy;public class mainTest {static int value 33;public static void main(String[] args) throws Exception{String[] sn…

面了字节大模型算法岗,太难了。。。

节前,我们组织了一场算法岗技术&面试讨论会,邀请了一些互联网大厂朋友、今年参加社招和校招面试的同学。 针对大模型技术趋势、大模型落地项目经验分享、新手如何入门算法岗、该如何准备面试攻略、面试常考点等热门话题进行了深入的讨论。 汇总合集…

ClickHouse实战处理(一):MergeTree表引擎

MergeTree作为家族系列最基础的表引擎,主要有以下特点: 存储的数据按照主键排序:创建稀疏索引加快数据查询速度。支持数据分区,可以通过PARTITION BY语句指定分区字段。支持数据副本。支持数据采样。 一、MergeTree分类和建表参…

[emailprotected](2)核心概念-JSX

目录 1,什么是 jsx2,空标签3,通过大括号使用 js4,防止注入攻击5,元素的不可变性 官方文档 1,什么是 jsx Facebook 起草的 js 扩展语法。本质上是 js 对象,会被 babel 编译,最终转换…

军队仓库管理系统|DW-S301系统特点

部队仓库管理系统DW-S301系统通过数据采集、互联网和物联网技术,实现数字化智能管控,以提高军用物资的仓储准确率和流转率,缩短周转时间,降低库存成本,也有助于消除生产过程中的不确定性。 系统功能:通过部…

web学习笔记(五十六)

目录 1.绑定类名和style 1.1 绑定类名 1.1.1 绑定单个类名 1.1.2 绑定多个类名 1.2 style相关知识 2. vue的响应式原理 3. v-once 4.本地搭建Vue单页应用 4.1 安装Vue脚手架 4.2 安装对应的包文件 4.3 运行项目 1.绑定类名和style 1.1 绑定类名 1.1.1 绑定单个类名…

计算机网络协议

网络协议 基于TCP的应用层协议 POP3(Post Office Protocol 3): 用于支持客户端远程管理服务器上的电子邮件。它支持**“离线”邮件处理**,即邮件发送到服务器上后,一旦邮件被POP3客户端下载到本地计算机,…

NL6621 实现获取天气情况

一、主要完成的工作 1、建立TASK INT32 main(VOID) {/* system Init */SystemInit();OSTaskCreate(TestAppMain, NULL, &sAppStartTaskStack[NST_APP_START_TASK_STK_SIZE -1], NST_APP_TASK_START_PRIO); OSStart();return 1; } 2、application test task VOID TestAp…

网页上的超链接复制到Excel中+提取出网址+如何保存

定义 超链接网页标题地址栏 使用的工具 2024年的WPS是不行的, 如果把知乎网页上的超链接复制到WPS中的Excel中,就会丢掉地址,只剩下网页标题 具体操作(转载,在Excel2013上验证可行) [1]启用【开发工具】&#xff…

Golang net/http标准库常用方法(三)

大家好,针对Go语言 net/http 标准库,将梳理的相关知识点分享给大家~~ 围绕 net/http 标准库相关知识点还有许多章节,请大家多多关注。 文章中代码案例只有关键片段,完整代码请查看github仓库:https://github.com/hltfa…

科技前沿:IDEA插件Translation v3.6 带来革命性更新,翻译和发音更智能!

博主猫头虎的技术世界 🌟 欢迎来到猫头虎的博客 — 探索技术的无限可能! 专栏链接: 🔗 精选专栏: 《面试题大全》 — 面试准备的宝典!《IDEA开发秘籍》 — 提升你的IDEA技能!《100天精通鸿蒙》 …

利用天气API接口自己DIY一个预报小管家

天气预报查询API 是一种实用的日常工具,它通过编程方式为开发者提供实时的天气数据。开发者可以通过简单的代码调用,与天气预报服务提供商进行交互,获取特定地区的天气信息,如温度、湿度、风速、风向、降水量等,以及未…

OWASP top10--SQL注入(一)

SQL注入式攻击技术,一般针对基于Web平台的应用程序.造成SQL注入攻击漏洞的原因,是由于程序员在编写Web程序时,没有对浏览器端提交的参数进行严格的过滤和判断。用户可以修改构造参数,提交SQL查询语句,并传递至服务器端…

XILINX FPGA DDR 学习笔记(一)

DDR 内存的本质是数据的存储器,首先回到数据的存储上,数据在最底层的表现是地址。为了给每个数据进行存放并且在需要的时候读取这个数据,需要对数据在哪这个抽象的概念进行表述,我们科技树发展过程中把数据在哪用地址表示。一个数…

K8S认证|CKA题库+答案| 11. 创建PVC

11、创建PVC 您必须在以下Cluster/Node上完成此考题: Cluster Master node Worker node ok8s master …

失落的方舟台服预下载教程 一键下载+账号注册教程

失落的方舟台服预下载教程 一键下载+账号注册教程 是一款今年备受瞩目的游戏,将于5月30日正式上线,这款游戏搭建在虚幻引擎的基础上,为玩家们带来了极佳的视觉体验。这款游戏秉承着MMO类型游戏一贯的玩法,但是制作组在…

海康威视硬盘录像机NVR连接公网视频监控平台,注册失败,抓包发现有403 forbidden的问题解决

目录 一、问题描述 二、问题定位 1、查看DVR的配置 2、查看需要使用的端口是否开放 3、查看日志 4、抓包 (1)找出错误 (2)查看数据包内容 三、问题分析 1、国标28181中的域的概念 2、域应该如何定义 (1&am…

ChatGPT可以开车吗?分享大型语言模型在自动驾驶方面的应用案例

自动驾驶边缘案例需要复杂的、类似人类的推理,远远超出传统的算法和人工智能模型。而大型语言模型正在致力实现这一目标。 人工智能技术如今正在快速发展和应用,人工智能模型也是如此。拥有100亿个参数的通用模型的性能正在碾压拥有5000万个参数的任务特…

缓存IO与直接IO

IO类型 缓存 I/O 缓存 I/O 又被称作标准 I/O,大多数文件系统的默认 I/O 操作都是缓存 I/O。在 Linux 的缓存 I/O 机制中,数据先从磁盘复制到内核空间的缓冲区,然后从内核空间缓冲区复制到应用程序的地址空间(用户空间&#xff0…

提示优化 | PhaseEvo:面向大型语言模型的统一上下文提示优化

【摘要】为大型语言模型 (LLM) 制作理想的提示是一项具有挑战性的任务,需要大量资源和专家的人力投入。现有的工作将提示教学和情境学习示例的优化视为不同的问题,导致提示性能不佳。本研究通过建立统一的上下文提示优化框架来解决这一限制,旨…