难以获得安莉父元素的宽度，子元素不能继承宽度吗？
在前端开发中，当我们想要获取父元素的宽度时，通常可以使用offsetWidth属性来获取。但是，如果父元素的宽度是通过CSS的display: none或者visibility: hidden等属性隐藏起来的，那么offsetWidth将返回0，因为隐藏的元素不会占据任何空间。
此外，子元素默认情况下是不会继承父元素的宽度的。子元素的宽度通常由其自身的内容、内边距(padding)和边框(border)决定。如果想要子元素继承父元素的宽度，可以使用CSS的width: inherit属性来实现。
然而，需要注意的是，并非所有的元素都支持继承宽度。例如，绝对定位的元素(position: absolute)和浮动元素(float: left/right)是不会继承父元素的宽度的。对于这些情况，可以考虑使用JavaScript来动态获取父元素的宽度，并将其应用到子元素上。
总结起来，要解决难以获得父元素宽度且子元素不能继承宽度的问题，可以采取以下步骤：
- 确保父元素没有被隐藏，否则无法获取其宽度。
- 使用
offsetWidth属性获取父元素的宽度，如果父元素被隐藏，则宽度为0。 - 如果需要子元素继承父元素的宽度，可以使用CSS的
width: inherit属性，但需要注意部分元素不支持继承宽度的情况。 - 对于不支持继承宽度的情况，可以使用JavaScript来动态获取父元素的宽度，并将其应用到子元素上。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云计算产品：https://cloud.tencent.com/product
- 前端开发相关产品：https://cloud.tencent.com/product/web
- 后端开发相关产品：https://cloud.tencent.com/product/scf
- 数据库相关产品：https://cloud.tencent.com/product/cdb
- 服务器运维相关产品：https://cloud.tencent.com/product/cvm
- 云原生相关产品：https://cloud.tencent.com/product/tke
- 网络通信相关产品：https://cloud.tencent.com/product/vpc
- 网络安全相关产品：https://cloud.tencent.com/product/ddos
- 音视频相关产品：https://cloud.tencent.com/product/vod
- 多媒体处理相关产品：https://cloud.tencent.com/product/mps
- 人工智能相关产品：https://cloud.tencent.com/product/ai
- 物联网相关产品：https://cloud.tencent.com/product/iotexplorer
- 移动开发相关产品：https://cloud.tencent.com/product/mpe
- 存储相关产品：https://cloud.tencent.com/product/cos
- 区块链相关产品：https://cloud.tencent.com/product/baas
- 元宇宙相关产品：https://cloud.tencent.com/product/mu
相关·内容
截图：我现在有这样的代码： style={{ width: '100%', /> </span> </li>
我希望文本的宽度
浏览 0提问于2018-01-22得票数 0
回答已采纳
我有3个div父元素、子元素和元素。div元素具有从子继承的宽度。问题是，子div的宽度等于100%，元素的宽度等于继承，这给了我以下结果：这是我要找的。我试过不同的方法。我无法理解为什么元素不能从父div继
浏览 0提问于2021-09-23得票数 2
我使用Bootstrap3在我的应用程序中创建页面。
每个子元素的宽度必须等于父元素的宽度
浏览 11提问于2017-05-31得票数 2
这是我的DOM：<body><tr>hello</tr></body>我的CSS： } border: 1px solid gray; width: 10;
浏览 3提问于2014-01-02得票数 0
回答已采纳
HTML很简单:一个‘容器’可滚动元素，它有一个‘父’子元素，而其子元素又有'bar‘和'content’子元素。“content”元素的宽度是动态的，但在本例中设置为“容器的宽度+100 is”。当您向右滚动时，红色条形图的宽度受到“父”元素宽度
浏览 4提问于2014-11-28得票数 0
回答已采纳
我有两个带有"position: absolute“css规则集的div元素。在子div中，有两个浮动的div元素。奇怪的是，孩子的div没有用内容正确地伸展。它将所有内容都包装在新的行上。它的行为就像是子div继承了父div的宽度，并且只扩展了显示内容所需的最小宽度。如果我删除父d
浏览 3提问于2017-03-08得票数 1
我从一个空的div(父目录)开始。并向其追加一个div，该div使用jquery中的css方法设置宽度和高度。但是父div并没有增长(我在chrome中查看了firebug控制台的检查)。我是否必须计算附加的宽度+边距并设置父div的尺寸
还有一个补充，当你设置父元素的宽度和高度时，会发生什么，它是否会使子元素
浏览 2提问于2012-03-01得票数 0
1回答
向上继承
、
我有一个dom元素，比如div，span (带有display:inline-block)，它的宽度是指定的，并且是另一个dom元素，比如th，td，div的唯一(非平凡的)子元素。有没有办法将宽度值继承到父级？
浏览 1提问于2012-01-29得票数 1
回答已采纳
4回答
关于强制嵌套的div子容器填充其父容器的宽度有很多问题，但我的问题是如何强制具有比其父容器更大的自然流动宽度的子div (例如，子div包含一个文本节点，最终将子节点拉伸到超出父容器的宽度)以保持其父容器的宽度一种简单的非动态解决方案是在父级上设置宽度，但如
浏览 2提问于2013-04-29得票数 2
回答已采纳
我在我的安卓项目中使用了。这段代码中有一个bug :如果子布局嵌套在父布局中，那么像fill, grow这样的约束将被忽略，因为mig4android只是忽略了它们。现在，我可以获得父元素的宽度和子元素的组件约束(可能有也可能没有grow、fill等)，如何计算子元素的宽度？miglayout提供了什么方法来做到这一点吗？
浏览 0提问于2012-09-22得票数 4
我有一个带有一些子元素的父元素。子元素有min-width集，但父元素没有。当浏览器窗口比min-width小时，子元素的宽度是正确的，但父元素变得越来越小，从而导致子元素溢出。
浏览 3提问于2012-10-24得票数 1
回答已采纳
2回答
我的网页<div class="col-md-12"></div>中有一个元素。目前，它正在维护父元素的宽度。但是如果我在position: fixed;上应用<div class="col-md-12"></div>，它的宽度就会增加。
如何使用position: fixed;保持先前的宽度？
浏览 5提问于2022-11-15得票数 0
我想要在父div中使用一些div，并且希望它们是浮动的。我希望所有的父空间都被分配给它的子空间，并在最后创建空的间隙。我想将孩子的div width设置为300，父宽度为1000，这样1000 /
浏览 2提问于2015-01-06得票数 1
1回答
继承选择元素的宽度
、、、
我在表格单元格中有一个select元素。我希望select继承元素的宽度，这样它就不会在正常状态下溢出。
当用户选择“选项”时，框可以扩展到最大元素的宽度。我尝试设置“最大宽度:继承”；但是我在某个地方读到，只有在设置了父元素的宽度属性时，这种方法才能工作。有人能指出正确的方法吗？谢谢!
浏览 2提问于2014-09-03得票数 2
回答已采纳
在本页中，当.gridster > ul的宽度被更改时，.gridster的宽度保持不变。通常，父元素的宽度随着子元素的宽度的变化而变化。为什么在这种情况下它保持不变。如何使父元素的宽度始终等于子元素的宽度。
浏览 2提问于2015-04-24得票数 0
回答已采纳
2回答
我有一个div，它的CSS将所有图像设置为一定的宽度。我想添加另一个，子div和这一个，但有它的图像不受约束-是大小，他们实际上是。
我不知道如何“重置”这些子元素的宽度属性，所以它不继承父元素吗？有人知道这是怎么做的吗？
浏览 1提问于2013-09-01得票数 0
回答已采纳
我猜默认的'auto‘设置会计算将值留给零以外的值。但是这个值是如何计算的呢？
另外，当值为100% vs继承时，如何计算宽度值会引起另一个混淆。我查找并意识到两者之间的区别是，虽然“宽度: 100%”将宽度设置为父元素计算值的100%，但“宽度:继承”从字面上占用父元素的CSS值，并将其应用于<em
浏览 4提问于2021-05-20得票数 0
回答已采纳
我有一个具有相对宽度的父元素。在浏览器完全展开后，其子元素的宽度更小。通过缩小浏览器，我可以使子元素保持其宽度，直到它最终成为与父元素相同的宽度，随后的收缩会使两个元素保持相同的宽度，但我必须使用固定的最大宽度，并且<em
浏览 3提问于2016-09-24得票数 1
回答已采纳
3回答
正如您可能已经注意到的，容器的宽度是80%。页眉继承了80%的宽度，但是页脚让我头疼。当我把宽度:继承在页脚上时，它看起来一点也不像父母的宽度。任何关于如何解决这个问题的建议。
浏览 3提问于2019-12-18得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
