css边距怎么设置


当前第2页 返回上一页

padding属性定义元素边框与元素内容之间的空间,即上下左右的内边距。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

<!DOCTYPE html>

<html>

 

    <head>

        <meta charset="utf-8">

        <style>

            p {

                background-color: yellow;

                width: 400px;

            }

             

            p.padding {

                padding: 100px 50px;

            }

            span{

                background-color: peachpuff;

            }

        </style>

    </head>

 

    <body>

        <p>这是一个没有指定边距大小的段落。</p>

        <p>这是一个没有指定边距大小的段落。</p>

        <p class="padding"><span>这是一个指定边距大小的段落:上下内边距100px,左右内边距50px。</span></p>

        <p>这是一个没有指定边距大小的段落。</p>

    </body>

 

</html>

效果图:

3.png

padding是一个简写属性,可以有一到四个值:

1

padding:25px 50px 75px 100px;

  • 上填充为25px

  • 右填充为50px

  • 下填充为75px

  • 左填充为100px

1

padding:25px 50px 75px;

  • 上填充为25px

  • 左右填充为50px

  • 下填充为75px

1

padding:25px 50px;

  • 上下填充为25px

  • 左右填充为50px

1

padding:25px;

  • 所有的填充都是25px

(学习视频分享:css视频教程)

以上就是css边距怎么设置的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

css height:auto 不起作用怎么办

css中position属性有哪些用法

学html css看什么书?

react如何引入css

前端工程师需要掌握哪些知识?

css中能加减乘除吗

css怎么改变hr标签颜色

邮件不支持css怎么办

css fixed是什么意思

css表格边框怎么设置

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...