专栏首页Html5知典padding-bottom 属性

padding-bottom 属性

用途

padding-botom 该属性用于设置标签的底部填充区域的高度,负值无效。

语法

/* <length> value */ 
padding-bottom: 2.5em; 

/* <percentage> value */ 
padding-bottom: 95%;

描述

<length>

此关键词定义了一个确定的宽度值。

<percentage>

此关键词始终同包含该元素的容器宽度有关。

例子

/* HTML */
<div id="red"> 
    <div id="orange"></div> 
    <div id="gray"></div>
</div>

/* CSS */
#red { 
    width: 200px;
    height: 200px; 
    background: red; 
    padding-bottom: 300px; 
    } 
#orange { 
    width: 50px; 
    height: 50px; 
    background: orange; 
    } 
#gray { 
    width: 50px; 
    height: 50px; 
    background: gray; 
    }

本文分享自微信公众号 - Html5知典(gh_5b9c8e323efa),作者:hudao

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2018-09-26

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • padding-left 属性

    padding-left 该属性用于设置标签的左部填充区域的高度,负值无效。

    Html5知典
  • margin-top属性

    这个属性对于不可替换的 inline 标签没有效果,比如 <tt> 或者 <span>。

    Html5知典
  • margin-bottom

    margin-bottom 规定性用于设置标签的底部外边距,可设置负数值。 该属性对设置了 non-replaced 的行内标签无作用,例如: <tt> ...

    Html5知典
  • 第97天:CSS3渐变和过渡详解

    渐变是CSS3当中比较丰富多彩的一个特性,通过渐变我们可以实现许多炫丽的效果,有效的减少图片的使用数量,并且具有很强的适应性和可扩展性。

    半指温柔乐
  • VUE.js高级

    首先先更正一下昨天发送内容的错误之处,对你造成的影响深表歉意。对照昨天的文章:ajax和vue.js(此处连接方便大家查看对照)中第6部分vue的事件与函数中,...

    小闫同学啊
  • padding-left 属性

    padding-left 该属性用于设置标签的左部填充区域的高度,负值无效。

    Html5知典
  • margin-top属性

    这个属性对于不可替换的 inline 标签没有效果,比如 <tt> 或者 <span>。

    Html5知典
  • scrollTop与offsetTop研究

    虽然我是做后台出身的,但最近心血来潮越来越关注前台技术了^_^,前二天看了“司徒正美”先生的图片无缝滚动分析后,对于scrollTop和offsetTop这二个...

    菩提树下的杨过
  • 电商项目(下)

    感谢你学习今天的内容,如果你觉得这篇文章对你有帮助的话,也欢迎把它分享给更多的朋友,感谢。

    达达前端
  • CSS写一个缺角的div

    今天用CSS写一个缺角的div,大致的效果是这样的,div的左上角和右上角缺掉了一块的效果,简称为缺角div

    王小婷

扫码关注云+社区

领取腾讯云代金券