首页 > 代码库 > css基础 设置div块的上下左右的内填充距离padding(缩写形式)

css基础 设置div块的上下左右的内填充距离padding(缩写形式)

 镇场诗:
    清心感悟智慧语,不着世间名与利。学水处下纳百川,舍尽贡高我慢意。
    学有小成返哺根,愿铸一良心博客。诚心于此写经验,愿见文者得启发。
——————————————————————————————————————————

code:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <style type="text/css">
        /*padding 内填充距离 内容到边线的距离
            width,height设置的是内容的长度
        */
        /*缩写的时候: 上右下左(自带循环倒退的功能)  
            ex:
              padding 5px 10px 20px
                      上   右   下
                           左
        */
        div {
            padding:5px 20px 50px;
            border:1px solid #d92525;
            width:700px;
        }
    </style>
</head>
<body>
    <div class="box">
1欲做精金美玉的人品,定从烈火中煅来;思立掀天揭地的事功,须向薄冰上履过。
2一念错,便觉百行皆非,防之当如渡海浮囊,勿容一针之罅漏;万善全,始得一生无愧。修之当如凌云宝树,须假众木以撑持。
3忙处事为,常向闲中先检点,过举自稀。动时念想,预从静里密操持,非心自息。
4为善而欲自高胜人,施恩而欲要名结好,修业而欲惊世骇俗,植节而欲标异见奇,此皆是善念中戈矛,理路上荆棘,最易夹带,最难拔除者也。须是涤尽渣滓,斩绝萌芽,才见本来真体。
5能轻富贵,不能轻一轻富贵之心;能重名义,又复重一重名义之念。是事境之尘氛未扫,而心境之芥蒂未忘。此处拔除不净,恐石去而草复生矣。
6纷扰固溺志之场,而枯寂亦槁心之地。故学者当栖心元默,以宁吾真体。亦当适志恬愉,以养吾圆机。
7昨日之非不可留,留之则根烬复萌,而尘情终累乎理趣;今日之是不可执,执之则渣滓未化,而理趣反转为欲根。
8无事便思有闲杂念想否。有事便思有粗浮意气否。得意便思有骄矜辞色否。失意便思有怨望情怀否。时时检点,到得从多入少、从有入无处,才是学问的真消息。
9士人有百折不回之真心,才有万变不穷之妙用。
10立业建功,事事要从实地着脚,若少慕声闻,便成伪果;讲道修德,念念要从虚处立基,若稍计功效,便落尘情。
    </div>
</body>
</html>

 



result:

技术分享

 


——————————————————————————————————————————
博文的精髓,在技术部分,更在镇场一诗。编辑器 VS2015,浏览器 Firefox。
html+css+js,强,值得努力学习。我跟着传智播客的视频教程学习。
我是一个新手,所以如果博文的内容有可以改进的地方,甚至有错误的地方,请留下评论,我一定努力改正,争取成就一个良心博客。
注:此文仅作为科研学习,如果我无意中侵犯了您的权益,请务必及时告知,我会做出改正。

css基础 设置div块的上下左右的内填充距离padding(缩写形式)