zoukankan      html  css  js  c++  java
  • CSS padding内边距

    padding

    padding属性设置元素的内边距。属性值默认0。属性值auto表示由浏览器计算内边距。属性值为百分比时是基于父元素的宽度计算。属性值可以是inherit

    这是一个简写属性,属性值最多为4个,分别表示上内边距,右内边距,下内边距,左内边距。属性值为三个时,分别表示上内边距、左右内边距、下内边距。属性值为两个时表示上下内边距、左右内边距。属性值为一个时表示四边内边距。

    block元素示例

    <p style="background-color: green;">Hello World</p>
    <p style="background-color: green;padding: 10px;">Hello World</p>
    

    结果:

    Hello World

    Hello World

    block和inline-block元素都可以通过padding改变自身容器的大小

    inline元素示例

      <span style="background: green; padding: 30px 10px;">Hello world</span>
      <p>正常元素</p>
    

    结果:
    Hello world

    正常元素

    inline元素设置上下padding是无效的,它只是把背景扩大了,并不会影响行高的计算,背景在视觉上可能会延伸到其他行,进而和其他内容发生重叠。

    优秀文章首发于聚享小站,欢迎关注!
  • 相关阅读:
    51nod 1051【基础】
    HDU5971【瞎搞】
    Lightoj1018 【状压DP】
    HDU2604【矩阵快速幂】
    HDU1501【简单DP】
    HDU3555【数位DP】
    Lightoj1037【状压DP】
    51nod 1099【贪心】
    HDU5950【矩阵快速幂】
    51nod 1049【经典】
  • 原文地址:https://www.cnblogs.com/yesyes/p/15356415.html
Copyright © 2011-2022 走看看