收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 2196|回复: 27

[闲聊] 想知道 margin与padding的用法

  [复制链接]
发表于 2011-11-14 19:45:46 | 显示全部楼层 |阅读模式
我个人认为padding最好不要用吧,能不这就不用

我个人理解是margin是对外的距离 padding是对内的距离 我觉得不要用padding的原因就是因为会增加宽度或高

比如<div id="nav" style="padding-left:10px; width:200px;"></div>这样#nav的宽就增加了10像素啊

可是为什么还是有些人那么喜欢用padding很难理解啊  一个页面上几乎没看到有margin
我不知道我是不是错了...
求正解啊...!!!

补充内容 (2011-11-14 19:53):
我只说块与块之前,比如新闻与产品之间距离是15px
用padding好还是用margin好
发表于 2011-11-14 19:48:56 | 显示全部楼层
比如div有背景的时候
回复 支持 反对

使用道具 举报

发表于 2011-11-14 19:51:02 | 显示全部楼层
margin 有时候有双倍
回复 支持 反对

使用道具 举报

发表于 2011-11-14 19:52:00 | 显示全部楼层
男人喜欢push 所以用padding
女人喜欢touch 所以用margin
回复 支持 反对

使用道具 举报

 楼主| 发表于 2011-11-14 19:52:34 | 显示全部楼层
navyblue 发表于 2011-11-14 19:51
margin 有时候有双倍

padding就不会了吗?
回复 支持 反对

使用道具 举报

 楼主| 发表于 2011-11-14 19:57:59 | 显示全部楼层
Herbs 发表于 2011-11-14 19:52
男人喜欢push 所以用padding
女人喜欢touch 所以用margin

这是技术,跟男女何关系,我遇到的那个人用padding的就是女人,难不成她是泰国人妖不成,如果是泰国人妖,那也是要泰国的吧,可是她偏偏是中国的,目前我是没见过中国人妖
回复 支持 反对

使用道具 举报

发表于 2011-11-14 20:09:34 | 显示全部楼层
是的,有句古话“不喜欢用margin的前端不是好前端”

LZ,我支持你用margin
回复 支持 反对

使用道具 举报

发表于 2011-11-14 20:10:02 | 显示全部楼层
这贴怎么转到水区了?
回复 支持 反对

使用道具 举报

发表于 2011-11-14 20:11:13 | 显示全部楼层
说一下我的愚见,各有各的用途。
回复 支持 反对

使用道具 举报

发表于 2011-11-14 20:23:08 | 显示全部楼层
回复 支持 反对

使用道具 举报

发表于 2011-11-14 20:55:25 | 显示全部楼层
靠,这么简单的问题一下子让你给复杂化了。
padding就是内填充,margin就是外边距。其它应用都是围绕此核心的。
有个屁讨论的。
回复 支持 反对

使用道具 举报

发表于 2011-11-14 21:00:39 | 显示全部楼层
xmlovedoudou 发表于 2011-11-14 20:55
靠,这么简单的问题一下子让你给复杂化了。
padding就是内填充,margin就是外边距。其它应用都是围绕此核心 ...

至少楼主能意识到有问题,并表示出有讨论的兴趣。

而你说其简单却只显露出无知。
回复 支持 反对

使用道具 举报

发表于 2011-11-14 21:15:28 | 显示全部楼层
内边距就是填充背景  外边距俗称空格 这就是差距
回复 支持 反对

使用道具 举报

发表于 2011-11-14 22:27:11 | 显示全部楼层
css3中的box-sizing:border-box;可以解决你的烦恼。
html结构:<div></div>
css3样式:
div{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;width:100px;height:100px;padding:10px;}
你随便padding,反正总的宽度就是100px,高度也是100px.
但是在css2.1中需要嵌套一层div,
html结构:<div class="outer"><div class="inner">box</div></div>
.outer{width:100px;height:100px;}
.inner{padding:10px;}
-------------
2.1中的任何有关padding和margin的用法经验归根到底还是要回归到“padding就是内填充,margin就是外边距”这个基本上。
所以过多的话都是扯淡,纯粹的扯淡,绝对的扯淡。
回复 支持 反对

使用道具 举报

发表于 2011-11-14 22:33:42 | 显示全部楼层
xmlovedoudou 发表于 2011-11-14 22:27
css3中的box-sizing:border-box;可以解决你的烦恼。
html结构:
css3样式:

正如你所说,这些都是经验之谈啊,对经验丰富的人来说是再正常不过的,可对新手就完全不一样了。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2011-11-14 22:35:46 | 显示全部楼层
xmlovedoudou 发表于 2011-11-14 22:27
css3中的box-sizing:border-box;可以解决你的烦恼。
html结构:
css3样式:

既然是扯淡,你怎么还扯那么多啊,你不是更扯淡吧,奶奶的

你不觉得加那么多div难受吗?
最终扯淡的还是你

.......
回复 支持 反对

使用道具 举报

发表于 2011-11-14 22:43:12 | 显示全部楼层
本帖最后由 xmlovedoudou 于 2011-11-14 22:48 编辑
buddies 发表于 2011-11-14 22:35
既然是扯淡,你怎么还扯那么多啊,你不是更扯淡吧,奶奶的

你不觉得加那么多div难受吗?


难受吗?如果是页面组件或者模块化的东西,这样添加的多余div是有必要的,尤其是经常改动的地方(当然也可以不用,具体问题具体对待)。
css3不用添加多余的div,你用啊!你妹的!
另外,在没有边框的情况下,padding和margin确实体现出了一定的模糊性。那你觉得哪个更容易布局,更容易维护,更容易扩展,这都是需要考虑进去的。
对了,脾气这么大,我得是把你家黑馍背去了?
你妹的,你妹的,你妹的...
回复 支持 反对

使用道具 举报

发表于 2011-11-15 10:26:40 | 显示全部楼层
IE6下margin又时是双倍的
不同浏览器对带了padding的宽度理解不同,有的加上了padding的宽度,有的没加上

用哪个看情况了
回复 支持 反对

使用道具 举报

 楼主| 发表于 2011-11-15 10:36:50 | 显示全部楼层
xmlovedoudou 发表于 2011-11-14 22:27
css3中的box-sizing:border-box;可以解决你的烦恼。
html结构:
css3样式:

我没妹妹,你大爷的...
回复 支持 反对

使用道具 举报

发表于 2011-11-15 10:37:09 | 显示全部楼层
padding是个好东西,但是margin有时候又是必不可少的,权衡着使用即可
PS: 讨论归讨论,生气可就补好了
回复 支持 反对

使用道具 举报

 楼主| 发表于 2011-11-15 10:40:11 | 显示全部楼层
baihe107 发表于 2011-11-15 10:37
padding是个好东西,但是margin有时候又是必不可少的,权衡着使用即可
PS: 讨论归讨论,生气可就补好了

楼上那个人是找骂  没事的,他是我哥
回复 支持 反对

使用道具 举报

发表于 2011-11-15 10:49:11 | 显示全部楼层
buddies 发表于 2011-11-15 10:40
楼上那个人是找骂  没事的,他是我哥

不是吧,你和你哥在这发火呀??外人看了还以为。。。。。
回复 支持 反对

使用道具 举报

发表于 2011-11-15 10:59:54 | 显示全部楼层
buddies 发表于 2011-11-14 22:35
既然是扯淡,你怎么还扯那么多啊,你不是更扯淡吧,奶奶的

你不觉得加那么多div难受吗?

看10楼那个帖子里面说的。

多加一个div也是目前无奈之举,为的就是扩展性
回复 支持 反对

使用道具 举报

发表于 2011-11-15 11:04:54 | 显示全部楼层
什么都看不懂,只看到有人在调情。
回复 支持 反对

使用道具 举报

发表于 2011-11-15 11:44:14 | 显示全部楼层
M是你他妈的离我远点
P是天冷穿上了羽绒服
回复 支持 反对

使用道具 举报

发表于 2011-11-15 12:43:30 | 显示全部楼层
div,我cao他大爷,这辈子都不纠结你了。。
回复 支持 反对

使用道具 举报

发表于 2011-11-15 14:32:29 | 显示全部楼层
这个贴子有点火. 两个属性,爱用哪个用哪个..浏览器不一样,大不了全部格式化后再用.
回复 支持 反对

使用道具 举报

发表于 2011-11-15 15:16:22 | 显示全部楼层
xmlovedoudou 发表于 2011-11-14 22:43
难受吗?如果是页面组件或者模块化的东西,这样添加的多余div是有必要的,尤其是经常改动的地方(当然也 ...

消气消气,保持风度,站好队列
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-9-20 13:48 , Processed in 0.140270 second(s), 8 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表