css margin属性,css margin属性怎么用？css margin属性用法教程

在css中，有一个重要的属性margin，很多人都不知道css margin属性是什么？怎么用，下面为您总结一下css margin属性用法教程。

margin是css用于在一个声明中，对所有css margin属性的简写，正因为margin来控制css中的块级元素之间的距离，所以两者是不是可见的。【推荐学习：CSS3教程】

一：css margin属性怎么用

margin属性包含了很多的属性，如下所示：

margin left ：是表示设置距左内边距；

margin top：是表示设置头顶元素块状的距离；

margin right：是表示设置距右元素块距离；

margin bottom ：是表示设置底部块状距离

二：css margin属性用法教程

1.margin left用法：

margin left：50px;语法后面紧跟着数字或者百分比，该语法表示距离左边元素块50像素点，或者距离元素50%的距离。

为了观察实例，我们使用两个盒子:

margin-left实例 www.divcss5.com

.php-a,.php-b

{float:left; width:150px; height:120px; border:1px solid #F00}

.php-b{ margin-left:50px}

.php-c{ margin-left:50px}

我们可以改动数值，可以观察其中变化，但是效果都是元素左边间距的位置大小。

2.margin right用法恰恰和margin left相反，定义为右边元素距离多少像素。

3.margin top：50px，语法后面紧跟数字，就是表示上边间距50个像素点，也可以使用百分比来表示。

4.margin bottom用法和margin top用法类似，并且在方向是相反的。

假如我们想在上下左右都用margin:10px来表示，margin我们要按照顺时针转法的思维就好了。【推荐阅读：margin：auto属性的用法详解】

以上就是对css margin属性怎么用？css margin属性用法教程的全部介绍，如果您想了解更多有关CSS3视频教程，请关注PHP中文网。

css margin属性,css margin属性怎么用？css margin属性用法教程相关推荐

css元素与浏览器边框,别具光芒CSS属性、浏览器兼容与网页布局
别具光芒CSS属性.浏览器兼容与网页布局语音编辑锁定讨论上传视频上传视频 <别具光芒CSS属性.浏览器兼容与网页布局>是2008年人民邮电出版社出版的图书.该书结合大量范例与实 ...
博客属性10个非常不错的CSS技巧
这几周个人几篇文章介绍了改博客属性的文章. 关联文章的地址在这里,妙巧的运用CSS的技能,可以让你不必修改HTML能就失掉很好的博客或者模板表面.我收集了一些非常用有的CSS技能让我们计设博客时更炫 ...
[css] 解释下为什么css的reset不建议直接这么写：*{ margin:0； padding:0；}？
[css] 解释下为什么css的reset不建议直接这么写:*{ margin:0; padding:0;}? 1.*为通配符,使用通配符,即全局范围遍历,耗费浏览器效率,增大负荷: 2.会影响后面的 ...
CSS文字文本样式（font字体、css外观属性）
1. font字体 1.1. font-size:大小作用:font-size属性用于设置字号. p { font-size:20px; } 单位: 可以使用相对长度单位,也可以使用绝对长度单位. ...
DIV CSS display (block none inline)属性的用法教程
在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例.图演示 ...
简述css属性选择器的几种定义方式_CSS 属性选择器详解
根据具体属性值选择除了选择拥有某些属性的元素,还可以进一步缩小选择范围,只选择有特定属性值的元素. 例子 1 例如,假设希望将指向 Web 服务器上某个指定文档的超链接变成红色,可以这样写: a[h ...
css阴影属性_第三场阴影场与属性访问器接口
css阴影属性这是" 影子字段与属性访问器"界面的第3轮 . 如果您是新手,但不确定要怎么做,请查看我以前的文章或关于开发JavaFX应用程序时节省内存的第一篇文章 . 作为J ...
[css] 字体的粗细的属性是用哪一个？它有哪些属性值？
[css] 字体的粗细的属性是用哪一个?它有哪些属性值? font-size指的应该是字体大小,字体粗细应该是font-weight,值有normal,bold,bolder,lighter,inhe ...
html无序列表中的正方形点点,CSS 有序或者无序列表的前面的标记 list-style-type 属性的实现...
例子: ul.none{list-style-type:none} ul.circle {list-style-type:circle} ul.square {list-style-type:squa ...

css margin属性,css margin属性怎么用？css margin属性用法教程

css margin属性,css margin属性怎么用？css margin属性用法教程相关推荐

最新文章

热门文章