首页 > 其他分享 >width:100%与width:auto区别

width:100%与width:auto区别

时间:2024-01-15 17:23:18浏览次数:25  
标签:撑满 auto 100% 元素 content width

小知识
width:100%与width:auto区别
width:100% : 子元素的 content 撑满父元素的content,如果子元素还有 padding、border等属性,或者是在父元素上设置了边距和填充,都有可能会造成子元素区域溢出显示;
width:auto : 是子元素的 content+padding+border+margin 等撑满父元素的 content 区域。
所以,在开发中尽量还是选择 width:auto ,因为当从边距、填充或边框添加额外空间时,它将尽可能努力保持元素与其父容器的宽度相同。而width:100%将使元素与父容器一样宽。额外的间距将添加到元素的大小,而不考虑父元素。这通常会导致问题。

标签:撑满,auto,100%,元素,content,width
From: https://www.cnblogs.com/zsnhweb/p/17965857

相关文章

  • C语言学习随笔-07 auto关键字
    1、在C中auto是一个存储类的关键字。     -auto存储类:auto存储类是所有局部变量默认的存储类。     -auto可以在声明变量的时候根据变量的初始值的类型自动为此变量选择匹配的类型。2、注意事项     -auto声明的变量必须要初始化,否则编译器不能判断变量......
  • 5G穿墙王!TP-LINK发布BE5100 Wi-Fi 7路由器:2.5G网口 279元
    1月14日消息,日前,TP-LINK发布BE5100Wi-Fi7路由器,到手价279元,支持MLO、4KQAM、MRU、前导打孔等Wi-Fi7新特性。据介绍,在MLO多链路技术加持下,2.4G+5G叠加快至7.3倍,4KQAM高阶调制,速率提升至120%。MRU技术允许将多个资源块分配给单个用户,提升传输效率,降低延迟。TP-LINKBE5100......
  • abc100d<枚举>
    题目D-PatisserieABC思路枚举三组权重和的正负情况,一共2^3种可能;对于每种情况,直接计算对应得分,取最大的m个蛋糕的得分求和;对所有情况的得分取最大即可。总结代码点击查看代码#include<iostream>#include<algorithm>#include<vector>usingnamespacestd;usi......
  • Nuxt3教程:添加Autoanimate 动画库
    前言AutoAnimate是一个零配置,插入式动画实用程序,可以为您的Web应用程序添加平滑过渡。您可以将其与React,Solid,Vue,Svelte或任何其他JavaScript应用程序一起使用。正文安装依赖#yarnyarnadd@formkit/auto-animate#npmnpminstall@formkit/auto-animate#pnpmpnpmadd......
  • 软件测试/测试开发/全日制|Pytest如何使用autouse实现自动传参
    Pytestfixture之autouse使用写自动化用例会写一些前置的fixture操作,用例需要用到就直接传该函数的参数名称就行了。当用例很多的时候,每次都传这个参数,会比较麻烦。fixture里面有个参数autouse,默认是Fasle没开启的,可以设置为True开启自动使用fixture功能,这样用例就不用每次都去传参......
  • 梦回2004!我用全志V3s做了个成本100元,功能媲美MP4的随身终端
    本项目是基于全志V3S的随身终端(类似MP4),命名为V3S-PI,开发板使用四层板制作,全板采用0603电容电阻,相较于0402,制作更为方便,同时成本可压缩至100以内。项目简介开发板选用全志V3S为主控,V3s单核Cortex-A7带有硬件浮点计算,且芯片内封64MbyteDDR2,无需再外接DDR2芯片,极大程度上为开发板的走......
  • P10058 Reverse and Rotate题解
    简单题意一共3个操作:rev:将字符串翻转。>\(x\):将后面\(x\)个字母移到前面。<\(x\):将前面\(x\)个字母移到后面。解法解法一看到#1到#3的范围可以打出暴力程序,按题意模拟,时间复杂度\(O(n|S|)\)。预计\(30\)pts。解法二很明显,第二个操作和第三个操作有点像......
  • 初中英语优秀范文100篇-058The Importance of Doing Sports-做运动的重要性
    PDF格式公众号回复关键字:SHCZFW058记忆树1Nowadays,moreandmorepeopleprefertostayathomewatchingTVandsurfingtheInternet,whichleadstofatnessandevenseriousillness.翻译如今,越来越多的人更喜欢待在家里看电视和上网,这导致了肥胖,甚至严重的疾病......
  • PAT乙级 P1003 我要通过!
    题目链接:由于需要统计字符串中各字符的出现次数,考虑使用\(\rmmap\)来进行统计。字符串中只有\(\rmP,A,T\)三种字母\(\longrightarrow\rmmap.size()==3\)题目仅给出了几条规则,因此我们将可能正确的结果罗列出来,看看能否找到一些规律。分析:任意形如xPATx的字符串都可以......
  • autocd快捷命令
    快捷命令 L直线M移动C圆EL椭圆XL射线轴线RO旋转E删除H填充TR修剪EX延伸PO点S拉伸U返回DDI直径标注DAN角度标注OP系统选项设置A圆弧T多行文字B块定义I块插入W定义块文件CO复制MI镜像O偏移F倒直角或圆角D标注样式DLI线......