社区
HTML5
帖子详情
网页里面的盒模型边距设置问题
qq_36060405
2018-12-14 09:05:51
因为浏览器网页的不同,所以一般的盒模型宽度和高度尺寸都用百分比来表示,但是设置百分比之后再调整margin的时候它有时因为尺寸不对就突出来了,请问大神们这方法应该怎么解决?
...全文
334
3
打赏
收藏
网页里面的盒模型边距设置问题
因为浏览器网页的不同,所以一般的盒模型宽度和高度尺寸都用百分比来表示,但是设置百分比之后再调整margin的时候它有时因为尺寸不对就突出来了,请问大神们这方法应该怎么解决?
复制链接
扫一扫
分享
转发到动态
举报
AI
作业
写回复
配置赞助广告
用AI写文章
3 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
du2lon
2018-12-28
打赏
举报
回复
如果想不突出来就在父盒设置溢出隐藏:overflow:hidden;
你这个应该是子盒设置了浮动!如果子盒要浮动并且不溢出父盒的话就在子盒列表的最后加一个隐藏盒并设置清除浮动!
<div class="box">
<div class="list">列表</div>
<div class="list">列表</div>
<div class="list">列表</div>
<div class="cf"></div>
</div>
<style>
.box{whidth:100%; hight:100%}
.list{width:38%; hight:350px; float:left; display:inline;}
.cf{height:0; clear:both;}
</style>
PS: 注意浮动盒一定要设置显示为行内样式,否则 IE 浏览器下很容易出错!比如 IE 6 下浮动盒设置了 margin 后会变为值的两倍!比如你设置 margin-left 为10px,它实际会显示为20px
yaotomo
2018-12-26
打赏
举报
回复
sass或者less预处理可以进行一些计算
天际的海浪
2018-12-14
打赏
举报
回复
可以用calc()计算函数
margin: 10px;
width: calc(50% - 20px);
CSS中的盒子模型(图片)
在
网页
设计中,CSS(层叠样式表)是用于控制
网页
元素外观的关键工具。其中,盒子模型(Box Model)是CSS布局的基础,它定义了元素如何占据空间并与其他元素交互。接下来,我们将深入探讨这个重要概念。 首先,盒子...
网页
里的两种盒子模型(W3C盒子模型、IE盒子模型)
IE盒子模型,又称怪异
盒模型
,是Internet Explorer早期版本(尤其是IE5和IE6)采用的模型。在这个模型中,元素的宽度(width)和高度(height)已经包含了内
边距
和边框,因此在计算总尺寸时,不需要额外加上这些值。这...
DIV CSS 盒子模型PPT演讲.zip
在
网页
设计中,DIV CSS是构建页面布局的重要工具,而盒子模型(Box Model)则是理解CSS布局的关键概念。这个PPT演讲将深入探讨这一核心知识点,帮助初学者掌握
网页
设计的基础。 首先,我们要了解什么是盒子模型。在...
最新大厂前端面试题-面试指南css篇面试题.docx
本文将详细讲解 CSS 相关知识点,涵盖 CSS 初始化、margin 重合
问题
、
盒模型
问题
、隐藏元素
问题
等多个方面。 考点 1:初始化样式
问题
CSS 初始化是指开发者对浏览器的默认样式进行重置。这样做的目的是为了解决...
HTML+CSS+JavaScript
网页
设计 第三章测试.docx
盒模型
是CSS布局的重要概念,它将
网页
元素视为具有内容(content)、内
边距
(padding)、边框(border)和外
边距
(margin)的矩形盒子。题目中提到的"表示四边的内
边距
的关键字"是`padding`,它决定了元素内容与边框之间的...
HTML5
39,118
社区成员
5,566
社区内容
发帖
与我相关
我的任务
HTML5
HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准,是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。
复制链接
扫一扫
分享
社区描述
HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准,是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章