0
0
php中世界最好的语言
发布时间：2018-01-20 09:24:36
|3643人浏览过
|来源于php中文网
原创
这次给大家带来div设置width后超出父元素应该如何解决，解决div设置width后超出父元素的注意事项有哪些，下面就是实战案例，一起来看一下。
前言
本文介绍的是利用CSS3的新属性box-sizing，解决div宽度设置width:100%后再设置padding或margin超出父元素的问题，有需要的朋友们可以参考借鉴。
语法
box-sizing: content-box|border-box|inherit;
值一、content-box
这是由 CSS2.1 规定的宽度高度行为。
宽度和高度分别应用到元素的内容框。
在宽度和高度之外绘制元素的内边距和边框。
值二、border-box
为元素设定的宽度和高度决定了元素的边框盒。
就是说，为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。
通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。
值三、inherit
规定应从父元素继承 box-sizing 属性的值。
这个 div 占据左半部分。
相信看了这些案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
相关阅读：
相关文章
html5可视化编辑怎么改边框样式_html5可视化边框设置技巧【技巧】
html5布局代码怎么居中元素_html5布局代码元素居中实现法【步骤】
html5布局代码flex空间分配_html5布局代码flex空间法【技巧】
如何让内联元素正确显示宽高并应用渐变背景
如何在标题旁创建带渐变背景的独立小方块
本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
热门AI工具
相关专题
php中文网为大家提供css3教程合集，CSS3的语法是建立在CSS原先版本基础上的，它允许使用者在标签中指定特定的HTML元素而不必使用多余的class、ID或JavaScript。php中文网还为大家带来css3的相关下载资源、相关课程以及相关文章等内容，供大家免费下载使用。
402
2023.06.14
css3中渐变属性有linear-gradient、radial-gradient、conic-gradient、repeating-linear-gradient、repeating-radial-gradient等。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。
140
2023.11.01
html5动画制作方法有使用CSS3动画、使用JavaScript动画库、使用HTML5 Canvas等。想了解更多html5动画制作方法相关内容，可以阅读本专题下面的文章。
515
2023.10.23
数据库三范式是一种设计规范，用于规范化关系型数据库中的数据结构，它通过消除冗余数据、提高数据库性能和数据一致性，提供了一种有效的数据库设计方法。本专题提供数据库三范式相关的文章、下载和课程。
360
2023.06.29
删除数据库是指在MySQL中完全移除一个数据库及其所包含的所有数据和结构，作用包括：1、释放存储空间；2、确保数据的安全性；3、提高数据库的整体性能，加速查询和操作的执行速度。尽管删除数据库具有一些好处，但在执行任何删除操作之前，务必谨慎操作，并备份重要的数据。删除数据库将永久性地删除所有相关数据和结构，无法回滚。
2083
2023.08.14
2026年最新赚钱平台入口汇总，涵盖任务众包、内容创作、电商运营、技能变现等多类正规渠道，助你轻松开启副业增收之路。阅读专题下面的文章了解更多详细内容。
54
2026.01.31
热门下载
相关下载
精品课程
最新文章
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
