html设置右边界,CSS边界(margin)—

我们首先来搭建实验margin的平台，一个p元素。点击下面的按钮以将这个p元素“圈出来”。

在p的外面还套着一个div，再点击下面的按钮将它圈出来。

CSS顶部边界：margin-top

通过设置CSS中的margin-top属性，我们可以设置元素的顶部边界。点击下面的按钮给元素设置一个5像素的顶部边界，看看实验的p元素会有什么变化。

margin-top:5px;

设置完顶部边界之后，我们发现p的顶部与div的距离反而变小了，这是因为默认情况下，p的上下是有margin的。

CSS底部边界、左侧边界、右侧边界

与顶部边界的道理是一样的，我们同样可以通过CSS的margin-bottom、margin-left、margin-right属性分别设置底部、左侧、右侧边界。可以点击下面的三个按钮实验一下。

margin-bottom:5px;

margin-left:5px;

margin-right:5px;

CSS边界：margin

与前面的缩略属性类似，我们可以一次指定所有方向的边界。只需要设置一个margin属性即可。点击下面的按钮给我们的实验p设置10像素的边界。

在设置margin属性的时候，我们会发现段落的边框与div的边框之间有了我们所指定的距离，这就是margin属性的作用。

html设置右边界,CSS边界(margin)——CSS实验室相关推荐

在html中设置margin属性,css中margin的4个属性
CSS中:margin:auto与margin: 0 auto;有什么区别 CSS中:margin:auto与margin: 0 auto;有什么区别.有的网站中写的是前者意思不同.margin:au ...
html怎么设置左偏移量,CSS中margin属性的偏移量详解（代码示例）
本篇文章给大家介绍一下CSS中margin属性的偏移量,有感兴趣的朋友可以看一看. 话不多说,我们直接进入正题~ 我们先来看一个具体的例子(相关推荐:CSS学习手册) 代码入下:HTML文件和CSS文 ...
html设置margin无效,CSS中margin不起作用的原因及解决方法
margin是一个属性,指定元素和元素之间的间距,但不能为内联元素指定边距,本篇文章将给大家介绍关于CSS中margin不起作用的原因及解决方法. margin不起作用的原因对于初学者来说,可能会经 ...
怎样用html设置文档格式,Dreamweaver使用CSS样式表设置网页文本格式
Dreamweaver使用CSS样式表设置网页文本格式互联网发布时间:2008-10-17 19:35:50 作者:佚名我要评论本文章介绍如何在 Dreamweaver 中使用层叠 ...
用于设定表格样式的附加css,Dreamweaver使用CSS样式表设置网页文本格式
核心提示:本文章介绍如何在 Dreamweaver 中使用层叠样式表 (CSS) 设置页面中的文本格式.您可以使用 CSS 以 HTML 无法提供的方式来设置文本格式和定位文本,从而能更加灵活自如地控 ...
html5中margin是什么意思,css中margin是什么意思，margin作用是什么？
一.介绍,什么意思? margin为对象外边距间隔属性.如果对一个对象比如div设置了边框后,再设置margin就会观察到这个div外面产生了间距边距. margin作用: 设置对象与其它对象的外边距 ...
C语言margin的作用是,css中margin是什么意思，margin作用是什么
一.简介,甚么含义? margin为对象外边距间隔属性.假如对一个对象比方div配置了边框后,再设置margin就会察看到这个div外面孕育发生了间距边距. margin感导: 设置对象与此外对象的外 ...
CSS中margin属性详解
margin属性概述 margin是CSS层叠样式表中用来规定围绕在元素边框周围空白区域范围的属性. 该接受任何长度单位,可以是像素.英寸.毫米或 em. 相关属性 margin 可以单独改变元素的上 ...
css布局margin介绍,深入理解css中的margin属性（推荐）
之前我一直认为margin属性是一个非常简单的属性,但是最近做项目时遇到了一些问题,才发现margin属性还是有一些"坑"的,下面我会介绍margin的基本知识以及那些" ...

html设置右边界,CSS边界(margin)——CSS实验室

html设置右边界,CSS边界(margin)——CSS实验室相关推荐

最新文章

热门文章