CSS——margin
CSS margin 属性
定义和用法
margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值。
说明
这个简写属性设置一个元素所有外边距的宽度,或者设置各边上外边距的宽度。
块级元素的垂直相邻外边距会合并,而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地,浮动元素的外边距也不会合并。允许指定负的外边距值,不过使用时要小心。
注释:允许使用负值。
例子 1
margin:10px 5px 15px 20px;
- 上外边距是 10px
- 右外边距是 5px
- 下外边距是 15px
- 左外边距是 20px
例子 2
margin:10px 5px 15px;
- 上外边距是 10px
- 右外边距和左外边距是 5px
- 下外边距是 15px
例子 3
margin:10px 5px;
- 上外边距和下外边距是 10px
- 右外边距和左外边距是 5px
例子 4
margin:10px;
- 所有 4 个外边距都是 10px
浏览器支持
所有浏览器都支持 margin 属性。
注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"。
可能的值
| 值 | 描述 |
|---|---|
| auto | 浏览器计算外边距。 |
| length | 规定以具体单位计的外边距值,比如像素、厘米等。默认值是 0px。 |
| % | 规定基于父元素的宽度的百分比的外边距。 |
| inherit | 规定应该从父元素继承外边距。 |
CSS——margin的更多相关文章
- HTML CSS——margin与padding的初学
下文引自HTML CSS——margin和padding的学习,作者fengyv,不过加入了一些个人的看法. 你在学习margin和padding的时候是不是懵了,——什么他娘的内边距,什么他娘的外边 ...
- CSS Margin(外边距)
CSS Margin(外边距)属性定义元素周围的空间. Margin margin清除周围的元素(外边框)的区域.margin没有背景颜色,是完全透明的 margin可以单独改变元素的上,下,左,右边 ...
- CSS margin属性取值
margin表示一个元素的外边距.取值为正值时,表示相对于正常流离邻近元素更远,而取负值时,使其更近 但是,设置margin后,四个方向的表现形式不同 自身发生移动:top.left margin-t ...
- CSS Margin(外边距)
CSS Margin(外边距) 一.简介 CSS margin(外边距)属性定义元素周围的空间. margin 清除周围的(外边框)元素区域.margin 没有背景颜色,是完全透明的. margin ...
- 细说 CSS margin
作者:https://coding.net/u/zhengkenghong原文:https://blog.coding.net/blog/css-margin 细说 CSS margin 本文着重描述 ...
- CSS:CSS margin(外边距)
ylbtech-CSS:CSS margin(外边距) 1.返回顶部 1. CSS margin(外边距) CSS margin(外边距)属性定义元素周围的空间. margin margin 清除周围 ...
- CSS margin collapsing All In One
CSS margin collapsing All In One margin collapsing margin 塌陷 / margin 合并 会出现 margin collapsing 的 3 种 ...
- css margin
css中margin边界叠加问题: 看个同方向和异方向margin重叠现象: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transiti ...
- HTML CSS——margin和padding的学习
你在学习margin和padding的时候是不是懵了,——什么他娘的内边距,什么他娘的外边距.呵呵呵,刚开始我也有点不理解,后来通过查资料学习总算弄明白了,现在我来谈一下自己对margin和paddi ...
随机推荐
- python中Switch/Case实现
学习Python过程中,发现没有switch-case,过去写C习惯用Switch/Case语句,官方文档说通过if-elif实现.所以不妨自己来实现Switch/Case功能. 方法一 通过字典实现 ...
- 如何使用grep 等命令快速的在日志中找到自己需要的内容
虽然使用linux也有好几年了,但是服务器端开发的活儿正经来算才干不到一年. 一直没有需求和机会会去花大量的时间排查日志啥的,直到我摊上了大事t t,写的代码在线上出了bug需要排查问题. grep可 ...
- python学习笔记十——模块与函数
第五章 模块与函数 5.1 python程序的结构 函数+类->模块 模块+模块->包 函数+类+模块+包=Python pyth ...
- awk、sed、grep三大shell文本处理工具之grep的应用
1.基本格式grep pattern [file...](1)grep 搜索字符串 [filename](2)grep 正则表达式 [filename]在文件中搜索所有 pattern 出现的位置, ...
- Java微信二次开发(六)
Token定时获取 需要导入库:添加log4j(slf4j-api-1.5.10.jar,slf4j-log4j12-1.5.10.jar,log4j-1.2.15.jar,并且在src下添加log4 ...
- liunx速查
文件和目录 Linux 主要目录速查表 /:根目录,一般根目录下只存放目录,在 linux 下有且只有一个根目录,所有的东西都是从这里开始 当在终端里输入 /home,其实是在告诉电脑,先从 /(根目 ...
- BZOJ5312 冒险(势能线段树)
BZOJ题目传送门 表示蒟蒻并不能一眼看出来这是个势能线段树. 不过仔细想想也并非难以理解,感性理解一下,在一个区间里又与又或,那么本来不相同的位也会渐渐相同,线段树每个叶子节点最多修改\(\log ...
- android限制横竖屏切换 方法
在需要限制横竖屏切换的时候,只需要在AndroidManifest.xml文件中加入android:screenOrientation属性限制. android:screenOrientation=& ...
- 沉迷Link-Cut tree无法自拔之:[BZOJ2049]洞穴勘探(蒟蒻的LCT板子)
来自蒟蒻 \(Hero \_of \_Someone\) 的 \(LCT\) 学习笔记 最近学了一波 \(LCT\) , 于是怒刷 \(LCT\) 合集...... $ $ 学的时候借鉴了 Clove ...
- 【转】用宏定义代替printf函数
问题提出 有时候我们想用宏定义来决定是编译debug版本的代码还是release的代码,dubug版本的代码会通过printf打印调试信息,release版本的代码则不会.我们总不能对每一条print ...