• css内外边距属性


    盒子模型:

    所有HTML元素可以看作盒子,在CSS中,"box model"是用来设计和布局时 使用。

    CSS盒模型本质上是一个盒子, 封装周围的HTML元素, 它包括:边距,边框,填充和实际内容。

    外边距属性:设置对象四边的外部边距

    • 内联块级元素和块级元素的可以设置外边距。
    • 内联元素可以设置左、右两边的外边距;若要设置上、下两边的外边距,必须先使该元素变为块级元素或内联块级元素。
    • 如果提供全部四个参数值,将按上、右、下、左的顺序作用于四边。
    • 如果提供两个,第一个用于上、下,第二个用于左、右。
    • 如果提供三个,第一个用于上,第二个用于左、右,第三个用于下。

    内边距属性:设置对象四边的外部边距

    • 设置内联块级元素和块级元素的内边距。
    • 行内元素可以设置左、右两边的内边距;若要设置上、下两边的内边距,必须先使该元素变为块级或内联块级元素。
    • 改变padding的值,就改变了content的大小
    • 而改变margin的值,则不改变content的大小
     1 <style type="text/css">
     2     #container{
     3         border: 2px black solid;
     4         width: 700px;
     5         height: 800px;
     6     }
     7     #child{
     8         border: 2px black solid;
     9         width: 400px;
    10         height: 400px;
    11         margin: 100px auto;/* 设置外边距 */
    12         padding: 100px;/* 设置内边距 */
    13     }
    14 </style>
    15 </head>
    16 <body>
    17     
    18     <div id="container">
    19         <div id="child">div1</div>
    20     </div>
    21 </body>
  • 相关阅读:
    使用AD你应该避免的五个错误
    卸载常用组件
    学会批处理,用心学很容易
    VI的用法
    安装Linux版VNC 企业版
    【3】淘宝sdk的下载和安装
    【7】创建一个自己的模板
    【6】网店模板目录及文件介绍
    【11】淘宝sdk的DOM、CSS规范、Widget规范(这个Widget规范差不多就是网页效果)和HTML规范
    【2】认识淘宝sdk模板
  • 原文地址:https://www.cnblogs.com/-maji/p/7647392.html
Copyright © 2020-2023  润新知