##

     padding的作用:

                控制子元素和父元素之间的位置关系
                
            padding设置方法:
                padding:10px
                padding:10px 20px  上下  左右
                padding:10px 20px 30px    上 左右 下
                padding:10px 20px 30px 40px   上右下左
            添加padding:  必须在宽高的基础上减去padding大小      有点类似给快递包裹塞填充物
 
            margin:的作用:
                控制盒子与盒子之间的位置关系
            margin的设置方法:
                margin:10px
                margin:10px 20px  上下  左右
                margin:10px 20px 30px    上 左右 下
                margin:10px 20px 30px 40px   上右下左
            相邻两个盒子上下的margin值.按照最大值设置.
            margin:0 auto;  //让当前元素在父元素里面左右居中

1+X证书学习日志——盒模型的更多相关文章

  1. CSS学习笔记——盒模型,块级元素和行内元素的区别和特性

    今天本来打算根据自己的计划进行前端自动化的学习的,无奈早上接到一个任务需求需要新增一个页面.自从因为工作需要转前端之后,自己的主要注意力几 乎都放在JavaScript上面了,对CSS和HTML这方面 ...

  2. css学习_css盒模型及应用

    1.看透网页布局的本质 2.盒模型 margin.border.padding.width.height a. border: 1px solid red                (solid/ ...

  3. WEB学习-CSS盒模型

    盒子的区域 一个盒子中主要的属性就5个:width.height.padding.border.margin. width是“宽度”的意思,CSS中width指的是内容的宽度,而不是盒子的宽度. he ...

  4. css学习笔记---盒模型,布局

    1.外边距叠加 当一个元素出现在另一个元素上面时第一个元素的底边距与第二个元素的上边距发生叠加,元素被包含时也有可能会发生叠加(如果没有内边距和边框),如果一个空元素没有内边距和边框本身也会发生上下边 ...

  5. 1+X证书学习日志——javascript基础

    js javascript js的组成: ECMAscript DOM BOM js放置的位置 <script></script> <script src="路 ...

  6. 1+X证书学习日志——css 2D&过渡

    css 位移常用属性 transform:translate(x,y): transform:translateX(); transform:translateY(); 旋转属性 2d旋转: tran ...

  7. 1+X证书学习日志 —— css样式表

    ## 因为初级的内容较多,所以选了一些有用的 需要记忆的内容写下 方便日后回顾 CSS语法   选择符{属性:属性值;} ##             所有的css代码 都要放在css样式表里面    ...

  8. 1+X证书学习日志——DOM节点的获取

    var oBox = document.getElementById('box');//获取ID为box的节点 var aBox = document.getElementsByTagName('di ...

  9. 1+X证书学习日志——函数

    工具得特点: 1:重复性使用 2:隐藏内部原理(细节) 3:选择性应用 创建函数: 1:关键字 function 函数名称(){ } 2:字面量创建 var fn = function(){ } 3: ...

随机推荐

  1. Python3基础 函数 参数为list 使用+=会影响到外部的实参

             Python : 3.7.3          OS : Ubuntu 18.04.2 LTS         IDE : pycharm-community-2019.1.3    ...

  2. 【插件式框架探索系列】使用多UI线程提升性能

    了解WPF线程模型的都知道,UI线程负责呈现和管理UI,而UI元素(派生自 DispatcherObject)只能由创建该元素的线程来访问,这就导致了一些耗时的UI操作将影 响到整个应用程序性能,未响 ...

  3. WITH ROLLUP、WITH CUBE、GROUPING语句的应用

    作者:Bobby0322 CUBE 和 ROLLUP 之间的区别在于:CUBE 运算符生成的结果集是多维数据集.多维数据集是事实数据的扩展,事实数据即记录个别事件的数据.扩展建立在用户打算分析的列上. ...

  4. 【444】Data Analysis (shp, arcpy)

      ABS suburbs data of AUS 1. Dissolve Merge polygons with the same attribute of "SA2_NAME16&quo ...

  5. jquery分页展示控件:kkpager

    kkpager v1.2 js分页展示控件,传入简单参数就能使用的分页效果控件 准备工作,引入js.css <script type="text/javascript" sr ...

  6. U-Boot NFS RCE漏洞(CVE-2019-14192)

    U-Boot NFS RCE漏洞(CVE-2019-14192) 原文:https://blog.semmle.com/uboot-rce-nfs-vulnerability/ 翻译:看雪翻译小组 - ...

  7. LeetCode:打印零与奇偶数【1116】

    LeetCode:打印零与奇偶数[1116] 题目描述 假设有这么一个类: class ZeroEvenOdd { public ZeroEvenOdd(int n) { ... } // 构造函数 ...

  8. 常见问题:计算机网络/完整HTTP访问

    域名解析 以浏览器进行HTTP访问为例,首先搜索自身DNS缓存(一般缓存1000条左右,仅缓存1分钟),若有且未过期,结束. 若未找到,则搜索操作系统的DNS缓存. 若未找到,尝试读取hosts文件. ...

  9. Java 非访问修饰符

    除了访问性修饰符,我们还有非访问性修饰符.这里主要说明static与final修饰符,其他修饰符以后用到再说. 一.static修饰符 static修饰符是用来修饰方法与变量. 1.创建StaticT ...

  10. MappingJackson2JsonView——model转成json

    一.ajax请求,返回ModelAndView对象,结果报404: @RequestMapping(value = "/video") public ModelAndView jj ...