CSS:使一个块元素填充父元素的整个空间？
在CSS中，要使一个块元素填充其父元素的整个空间，可以使用以下方法：
- 使用
width: 100%和height: 100%属性。
.child-element {
width: 100%;
height: 100%;
}- 使用
flexbox布局。
.parent-element {
display: flex;
justify-content: center;
align-items: center;
}
.child-element {
flex-grow: 1;
}- 使用
grid布局。
.parent-element {
display: grid;
}
.child-element {
grid-column: 1 / -1;
grid-row: 1 / -1;
}这些方法可以使一个块元素填充其父元素的整个空间。请注意，这里没有提到其他云计算品牌商，因为这些方法是通用的CSS技术，与特定的云计算品牌无关。
相关·内容
我试图在<th>元素中放置一个链接，并让<a>元素填充<th>的整个空间。虽然我可以让它水平地与宽度:100%，让它的垂直填充证明是麻烦的。身高:百分之百似乎没有效果。我希望这样做，这样用户就可以单击单元格中的任何位置来激活链接。我知道我可以在onClick本身上放置一个<th>属性，并通过javascript来处理它，但是我想用“适
浏览 0提问于2009-02-13得票数 25
回答已采纳
4回答
我有JS生成的内容，并希望围绕它的div。CSS： border: solid 1px red; height: 300pxthought
浏览 15提问于2011-03-10得票数 5
回答已采纳
1回答
然而，被接受的解决方案在CHROME中不起作用(正如墨卡托的评论中所指出的那样)。建议为元素添加一个height:100的修复方法也不起作用。有没有人知道如何使用基于webkit的浏览器来实现这种效果？链接 (由原始发帖者提供)显示了此问题。它可以在FF/IE中工作，但不能在chrome中工作。
谢谢。
浏览 0提问于2009-11-09得票数 1
1回答
我想以不同的颜色显示<blockquote>元素，所以我添加了background-color CSS属性。但是不幸的是，在我做了这个更改之后，<blockquote>元素的彩色框将文本封装得太紧了：
我将padding: 10px CSS属性添加到<blockquote>元素中，以便在文本周围添加空间。但是不幸的是，在我做了这个更改之后，这个颜色的盒子太大了
浏览 2提问于2022-05-18得票数 0
回答已采纳
我有一个带有overflow-x: auto的容器元素，它的宽度是一定的。在它中，我有一个块级标头元素(h1)，它应该是块元素，水平填充容器。它这样做，只要容器中没有溢出的其他元素，就会创建一个水平滚动条。如果存在溢出元素，则标头元素只填充容器的非溢出水平空间</em
浏览 10提问于2014-06-03得票数 9
回答已采纳
3回答
我有一个绝对位置浮动在右边(绿色)的div。正确的是，突出一半的问题是当窗口缩小到985 to页面的最小大小时。虽然div是浮动的，但它可以通过减少窗口滚动来避免这种情况吗？</div>
通过简单的设计，这是一张很小的图片
浏览 2提问于2014-11-06得票数 1
回答已采纳
9回答
以前我对width: auto的假设是宽度设置为内容的宽度。现在我看到它采用了父对象的整个宽度。
有谁能描述一下它们之间的区别吗？
浏览 13提问于2013-07-04得票数 129
回答已采纳
2回答
我有一个父div (like_user_wrapper)，其中包含一个小的图像图标，下面是我的代码：css margin-top:20px; height:30px; position:relative;}
但是，包装器的宽度不能与<
浏览 3提问于2014-02-17得票数 1
回答已采纳
我有一个导航菜单，它是一系列的<ul>列表，其中的第一个<li>是一个选项卡。我想让整个<li>而不是选项卡中的<a>标记成为可点击的。<li id="navtab"> <&#x
浏览 0提问于2009-12-30得票数 2
回答已采纳
3回答
我有这样的设置： <div class="moverBoy"></div> </div>
父元素是一个永远固定的元素，比如100x20。moverBoy和smartBoy总是有20个高度，并且是内联块</e
浏览 10提问于2014-11-26得票数 0
回答已采纳
1回答
如何在缩小窗口宽度的同时使div消失，使它的完整空间可供其他元素使用？我的意思不是在overflow上一块一块地隐藏，而是整个元素。我在以下网址中偶然发现了这个出色的功能：
javascript是必需的吗?还是可以用CSS完成？我注意到这个页面很像HTML5。
浏览 0提问于2012-08-11得票数 2
回答已采纳
我不太确定没有伪元素能不能做到这一点--但我知道些什么。每个李里面都有一个<A>。
显然，这很容易通过1行代码来完成，只需将display:block和line-height添加到锚中即可。因此，要重述
浏览 3提问于2016-05-25得票数 1
回答已采纳
2回答
我在另一个元素(即父元素)中嵌套了一个元素。问题是，我希望使子元素比父元素更宽，因为我无法找到将其移出当前父元素所需的PHP代码。</div>是另一个右浮动的块。
看到蓝色的文字块了吗？如箭头所示，我想使用css width:980px;将其扩展到<em
浏览 6提问于2012-03-11得票数 1
回答已采纳
2回答
编辑:我想把这个从注释中移到上面，并尝试在这里回答它，以便给出更多关于我感到困惑的地方：“是的，似乎是这样”，而带有位置的元素的位置和尺寸是相对于它的包含块的，而带有位置的元素的位置和尺寸总是相对于初始的包含块所以我看到了这个位置:固定将设置相对于视图的尺寸，但是视图不是整个浏览器窗口吗？那么，为什么它的大小会下降到零呢？除此之
浏览 3提问于2014-06-19得票数 1
回答已采纳
1回答
两个固定宽度元素之间的未知宽度
、、、、
前言:我通常不是一个UI的人，所以如果我对CSS有一个严重的误解，请原谅我。请知道，这个问题是经过几个小时的研究/把我的头撞到墙上的:)
本质上，我要做的是将一个未知数量的元素扩展到一个未知宽度的空间中，在两个已知宽度的元素之间，所有这些元素都在一个可变宽度
浏览 5提问于2013-10-23得票数 1
回答已采纳
从这里的所有问题中，我假设大多数人希望他们的div(或lis或其他任何东西)填充水平空间。我想让它们只有我需要的时间。在这里，它们填充水平空间：
另外，div (或ul或li等)什么时候应该
浏览 2提问于2013-07-21得票数 2
回答已采纳
4回答
我想了解当CSS为display:block的元素是CSS为display:inline的元素的DOM子元素(因此块元素是内联元素的子元素)时会发生什么。BODY元素包含一个匿名文本块(C1)，后面是块级元素，后面是另一个匿名文本块(C2)
浏览 6提问于2009-09-03得票数 35
回答已采纳
这是一个困扰了我一年的问题。根本的问题是，我如何设置一个元素相对于它的父元素的大小，以便从每条边插入N个像素？设置宽度会很好，但是您不知道父元素的宽度，并且希望元素随窗口调整大小。(您不希望使用百分比，因为您需要特定数量的像素。)
编辑我还需要防止内容(或缺乏内容)拉伸或收缩这两个元素。我得到的第一个<
浏览 1提问于2008-09-24得票数 1
回答已采纳
默认情况下，Column {}具有其最大子元素的宽度。如何使所有其他元素适合父Column的宽度？如果我使用Modifier.fillMaxWidth()，元素将占用整个可用空间，并使父Column更大。如何实现Modifier.matchParentWidth()修饰符所提供的相同行为？
浏览 12提问于2021-01-28得票数 48
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
