关于margin的数值是百分比，参照对象

最新推荐文章于 2024-03-28 15:12:12 发布
最新推荐文章于 2024-03-28 15:12:12 发布
阅读量3.3k 收藏 3
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_33574890/article/details/78002158
版权

我在牛客网刷题时候碰到过一次这个问题，实际操作中也遇到一次。

真相就是：

可以对margin设置百分比，百分数是相对于包含块的width计算的，不管是margin-top，margin-bottom，margin-left还是margin-right（padding也是同样道理。）

猫不在
关注
关于一些CSS中改变元素位置的属性的百分比参考对象的总结
背影、的博客
08-09 334
1.写在前面 在写页面CSS过程中不可避免的需要写到一些改变元素位置的属性，例如改变元素外边距、内边距，改变定位元素的偏移等，当这些元素属性设置为一个绝对的数值时，你当然知道它会移动一个绝对的数值的位置；然而当其设置为百分比值时，你是否会思考：这个百分比值是相对于其包含块的大小还是相对于元素自身的大小呢？ 本文就一些常用改变元素位置的属性的百分比参考对象给出总结。 2.参考对象 2.1 定位属性 top right bottom left top、left、right、bottom是定位元素属性，非定位
-百分比设置margin和padding,line-height,height
rocktanga的博客
02-14 934
用百分数设置margin和padding 用百分数设置margin和paddding的时候，其top right bottom left的值是参照父元素盒子的宽度进行计算,如 .demo1{ width:980px;height:500px; } .demo1 div{margin:10% 5%; } // 相当于margin:98 49; 为什么都是以宽度为标准 1、高度持续增加 第一种说法是，padding-top如果以容器高度为参照，那么子元素应用padding值将会继续加高容器的高度，容器.
css中margin属性值百分比的使用
热门推荐
三三
02-21 1万+
margin使我们使用得很频繁的一个属性，用来设置一个元素所有外边距的宽度，或者设置各边上外边距的宽度，可以有 1 到 4 个值。例子：margin:10px 5px 15px 20px; 说明： 属性值 描述 auto 浏览器计算外边距 length 规定以具体单位计的外边距值，比如像素、厘米等。默认值是 0px % 规定基于父元素的宽度的百分比的外边距 inheri...
css-margin与百分数的关系
weixin_34168880的博客
12-28 161
可以对元素的margin设置百分数，百分数是相对于父元素的width计算，不管是margin-top/margin-bottom还是margin-left/margin-right。（padding同理） 如果没有为元素声明width，在这种情况下，元素框的总宽度包括外边距取决于父元素的width，这样可能得到“流式”页面，即元素的外边距会扩大或缩小以适应父元素的实际大小。如果对这个文档设置样式，...
css——百分比设置margin（外边距）
start_XUEBA的博客
11-15 2351
对元素的margin（外边距）可以设置百分数值。 对元素的 margin（外边距）设置百分数值：百分数是相对于父元素的width来计算的。 HTML： <div class="contain"> <div class="d1"></div> </div> css： .contain{ width: ...
margin的百分比
iteye_1478的博客
11-29 91
百分数是相对于父元素的 width 计算的。上面这个例子为 p 元素设置的外边距是其父元素的 width 的 10%
关于在百分比布局中margin使用百分比布局存在的问题
最新发布
陈三愿的博客
03-28 198
margin如果采用百分比布局，则margin-bottom和top百分比依据的父元素是宽度而不是高度，所以如果使用2%，则实际上的底部外边距是6px。在页面展示过程中出现的情况是将margin-bottom展示的高度不同。
CSS中的一些百分比相关调试经验分享
12-13
百分比值表示一个数值相对于另一个数值的比例，这个参照值通常与元素的特定属性有关。例如，`width`和`height`属性的百分比值是相对于元素的包含块（通常是其父元素）的宽度和高度来计算的。这意味着，如果一个元素...
十四、vw vh移动端布局，关于移动端的两种布局以及常用单位
快乐de馒头
09-05 2984
移动端常用的布局、；
前端html是什么？html5、css3是什么？
sdh19981202的博客
09-30 887
网页的构成 网页由结构（html）、表现（css）、行为（javascript）组成。 什么是html？ HTML 指的是超文本标记语言 (Hyper Text Markup Language) www万维网的描述性语言。 html的语法： 常规标记(双标记)： <标记名称 属性1名=“属性1值” 属性2名=“属性2值” ………… ></标记名> 空标记（单标记）：<标记名 属性1名=“属性1值” /> 书写结构 <!DOCTYPE html> &
margin-top使用百分比还是像素
xiaoouh的博客
02-17 587
当外层的容器的高是采用像素时，那么内层的容器采用像素的margin-top, 如果外层是百分比，那么内层采用像素
margin padding是以什么为参照物
liusixsixsix的博客
08-13 311
什么是异步 异步，是相对于同步而言的。我们在使用Vue时，使用到的组件大多为同步组件。在vue实例第一次执行渲染的过程中，已经生成了组件构造器。而异步组件则是在用到该组件时，异步通过请求去拉取对应组件的js（这里需要和webpack的import相结合）。当对应的js加载完成后，获取到异步组件的配置项，从而创建组件构造器。再通过forceRender，强制依赖它的vm实例重新触发渲染函数。 当用户进入时，如果把所有的组件都进行加载，会导致用户体验下降，等待时间过长。所以就需要使用异步组件。 如何使用异步组件
margin值类型为百分比
小样
11-10 2352
margin的值类型有两个 1、px（像素） 2、%（百分比） 这里主要描述当margin的 值为百分比的时候， 会出现的一个你意想不到的情况！<div class="container"> <div class="mg_top"></div> </div><style type="text/css"> .container{width: 600px ;hei
css padding-top padding-bottom margin-top margin-bottom采用百分比时参照对象
avtcpm1927的博客
10-09 197
css padding-top padding-bottom margin-top margin-bottom采用百分比时参照对象 之前想用padding-top来实现垂直居中，后来发现这是不可能的。 padding-top padding-bottom marg...
常见样式问题三、margin、padding百分比
c11073138的博客
03-04 697
1、margin百分比介绍可以对元素的margin设置百分数，百分数是相对于父元素的width计算，不管是margin-top/margin-bottom还是margin-left/margin-right。（padding同理）。如果没有为元素声明width，在这种情况下，元素框的总宽度包括外边距取决于父元素的width，这样可能得到“流式”页面，即元素的外边距会扩大或缩小以适应父元素的实际大小...
大数据应用案例：疫期全国减租，某地产公司为什么能营收30亿元？
思迈特Smartbi
11-03 258
​2020年受疫情裹挟，实体商业发展艰难，“黑天鹅”事件也加剧了商业不动产行业的“难”——“外资商场撤退，百货加速闭店”。 尽管危机四伏，仍有部分商业地产公司坚定地迈出了前进的步伐。其中，披荆斩棘有望抢占C位的，当属印力集团！1月，印力集团对旗下在营项目的所有商户减半收取2月租金，成为最美的“逆行者”。 2020年，印力集团仍取得了不错的成绩，上半年商业租金收入超过30亿元，开业项目整体出租率超过90%。这一切成绩的背后，是印力集团在数据化运营上的前瞻洞察。 国内商业地产行业在过年几年虽然发展迅速，但整体质
CFA一级知识点总结
weixin_33690367的博客
09-10 7341
更多来自: www.vipcoursea.com Ethics 部分 Objective of codes and standard：永远是为了maintain public trust in 1.Financial market 2.Investment profession 6个code of ethics 1.Code 1—ethics and pertinent...
NOI2.6基本算法之动态规划 踩方格 分析----标志物的作用
cqbzcsq的博客
08-19 2401
一、题目描述 总时间限制: 1000ms 内存限制: 65536kB 描述 有一个方格矩阵，矩阵边界在无穷远处。我们做如下假设： a.    每走一步时，只能从当前方格移动一格，走到某个相邻的方格上； b.    走过的格子立即塌陷无法再走第二次； c.    只能向北、东、西三个方向走； 请问：如果允许在方格矩阵上走n步，共有多少种不同的方案。2种走法只要有一步
关于NOI动态规划
sheilatime的博客
01-17 939
关于动态规划： 动态规划的重要性我不必强调了，从06年开始或多或少年年有的一个科目。现在大家对动态规划的理解已经基本不错了，再强化一下更好。希望大家能够在开学半个月之内彻底解决本文所说的所有内容。因为开学考试的问题，不难为你们也不难为我。 Common动态规划基本性质是对于每个子问题是无后效性的。鉴于这个问题，对于一些图论问题，如果图是”有向无环图”，那么显然满足无后效性。如果图有环，那么可以
CSS margin详解：百分比、定位与自适应应用
CSS中的margin属性是布局设计中不可或缺的一部分，特别是理解和掌握其百分比值计算规则对于创建响应式和灵活的设计至关重要。以下是关于margin知识点的重要概述： 1. **百分比margin**： 当我们在普通元素（如img...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值