zoukankan      html  css  js  c++  java
  • 盒模型--padding

    突然增加padding会使盒子变大,所以要按实际情况做调整。

    没有写padding的时候:

    <style>
    div{
    background:gray;
    }
    </style>
    </head>
    <body>
    <div>
    有一首诗最为动人,那就是青春;有一段人生最美丽,
    那就是青春;有一道风景最为亮丽,那就是青春。
    青春,不要说已疲惫,也许你的幻想曾被现实无情毁灭,
    也许你的追求毫无结果,但你应该相信,没有寒风的洗礼,哪来万紫千红的春天,没有心的耕耘,哪有累累硕果?
    </div>

    加了padding后:

    字没有紧贴在边缘。padding和border一样,可以给出一个像素确定四边的像素,也可以把四边的像素一一给出,或者只给出某一边的,padding-top:10px;

    padding与背景色:

    <style>
    div{
    100px;
    height:100px;
    background:gray;
    border:30px solid blue;
    padding:20px;
    }
    </style>
    </head>
    <body>
    <div>
    有一首诗最为动人,那就是青春;有一段人生最美丽
    </div>
    </body>

  • 相关阅读:
    10.28
    10.29
    11.05周四
    数据库增删改查
    11.03Tuesday
    11.10
    连接数据库
    10.30
    11.04周三
    10.27
  • 原文地址:https://www.cnblogs.com/wangruifang/p/5670947.html
Copyright © 2011-2022 走看看