css外上边距怎么设置,css上边距怎么设置

秒速五厘米 2022-09-03 01:29 342阅读 0赞

CSS设置上边距的方法一:使用margin-top属性

margin-top属性可以设置元素的上外边距

围绕在元素边框的空白区域是外边距。设置外边距会在元素外创建额外的“空白”。

外边距属性受任何长度单位(可以是像素、英寸、毫米或 em。)、百分数值甚至负值。

属性值:

描述

auto

浏览器设置的上外边距。

length

定义固定的上外边距。默认值是 0。

%

定义基于父对象总宽度的百分比上外边距。

inherit

规定应该从父元素继承上外边距。

示例:

p.ex1 {margin-top:2cm;}

一个没有指定边距大小的段落。

一个2厘米上边距的段落。

一个没有指定边距大小的段落。

效果图:

87b7c98b20b1f84e7af88bd3fa83081b.png

css设置上边距的方法二:使用padding-top属性

padding-top属性可以设置元素的上内边距

元素的内边距在边框和内容区之间,是元素边框与元素内容之间的空白区域

内边距属性接受长度值或百分比值,但不允许使用负值。

属性值:

描述

length

规定以具体单位计的固定的上内边距值,比如像素、厘米等。默认值是 0px。

%

定义基于父元素宽度的百分比上内边距。此值不会如预期的那样工作于所有的浏览器中。

inherit

规定应该从父元素继承上内边距。

示例:

p.padding {padding-top:2cm;}

p.padding2 {padding-top:20%;}

这是一个没有上部填充边距的文本。这是一个没有上部填充边距的文本。这是一个没有上部填充边距的文本。

这个文本的上部填充边距为2厘米。这个文本的上部填充边距为2厘米。这个文本的上部填充边距为2厘米。

这个文本的上部填充边距为20%。这个文本的上部填充边距为20%。这个文本的上部填充边距为20%。

效果图:

3d4e0a0b8fe9f89fd947512d8ce57a5c.png

发表评论

表情:
评论列表 (有 0 条评论,342人围观)

还没有评论,来说两句吧...

相关阅读

    相关 CSS 外边合并

    CSS 外边距合并 ![在这里插入图片描述][20210325192055399.gif] > 外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。 >

    相关 CSS外边叠加

    盒模型概念 盒模型是css的基石之一,它指定元素如何显示及(在某种程度上)如何相互交互。页面上的每一个元素都被看做一个矩形框,这个框右元素的内容、内边距、