博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
盒子模型,top和margin-top
阅读量:5069 次
发布时间:2019-06-12

本文共 445 字,大约阅读时间需要 1 分钟。

1.

标准盒子模型:

width只是内容的宽度。

元素的总宽度=width + padding*2 +border*2 +margin*2。

IE盒子模型:

width=内容的宽度 + padding*2 + border*2。

元素的总宽度=width +margin*2。

2.top

top 属性规定元素的顶部边缘。该属性定义了一个定位元素的上外边距边界与其包含块上边界之间的偏移。

注释:如果 "position" 属性的值为 "static",那么设置 "top" 属性不会产生任何效果。position必须设置。

This is a heading

效果图:

可以看出,是相对他的父元素定位的。

2.margin-top

设置元素的上外边距。

这个段落没有指定外边距。

这个段落带有指定的上外边距。

效果图:

可以看出:margin-top外边距相对的是离他最近的元素。

 

转载于:https://www.cnblogs.com/sunmarvell/p/9124567.html

你可能感兴趣的文章
LinkedList源码分析
查看>>
TF-IDF原理
查看>>
用JS制作博客页面背景随滚动渐变的效果
查看>>
JavaScript的迭代函数与迭代函数的实现
查看>>
一步步教你学会browserify
查看>>
Jmeter入门实例
查看>>
亲近用户—回归本质
查看>>
中文脏话识别的解决方案
查看>>
CSS之不常用但重要的样式总结
查看>>
Python编译错误总结
查看>>
URL编码与解码
查看>>
日常开发时遇到的一些坑(三)
查看>>
Eclipse 安装SVN插件
查看>>
深度学习
查看>>
TCP粘包问题及解决方案
查看>>
构建之法阅读笔记02
查看>>
添加按钮
查看>>
移动端页面开发适配 rem布局原理
查看>>
Ajax中文乱码问题解决方法(服务器端用servlet)
查看>>
会计电算化常考题目一
查看>>