##

     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. asp乱码问题

    UTF-8编码的话:在ASP脚本顶部加入<%@Language="vbscript" Codepage="65001"%>以及再在<head& ...

  2. Spring cloud微服务安全实战-6-1本章概述

    这一章来讲一下,微服务之间的通讯安全. 当前这个架构还存在的问题 在网关上做限流还是有一些问题的.例如我的订单服务限流是100,库存服务限流也是100.但是我的订单服务会调用我的库存服务.那么在网关这 ...

  3. 【DataBase】Hsqldb与项目集成

    Hsqldb与项目集成 进行模式下集成 可以集成进行(In-Process)模式下的hsqldb,由于数据存储在文件中,即使程序退出,数据也不会被销毁 采用jdbc集成的方式 package com. ...

  4. [ jenkins ] 基础安装及权限管理

    1. 安装 jenkins 在安装 jenkins 之前需要 java 的支持 (1)安装 jdk1.8 [root@192.168.118.17 ~]#tar xf jdk-8u77-linux-x ...

  5. JS正则匹配邮箱格式

    观察一些邮箱格式,有些邮箱格式简单,有些复杂,在网上找了个邮箱的正则表达式,分析一下邮箱的规则.该表达式:/^\w+([\.\-]\w+)*\@\w+([\.\-]\w+)*\.\w+$/ 拆分:[1 ...

  6. CentOS7使用yum安装RabbitMQ

    转自:https://jingyan.baidu.com/article/456c463b16f3820a583144a1.html 登录名:admin   密码:admin 1. 如果安装后web界 ...

  7. docker里安装kali linux

    docker里安装kali linux 官网镜像 docker search kali docker pull kalilinux/kali-linux-docker vi /etc/apt/sour ...

  8. Docker 常用模式

    Deployment Service Daemonset 这种模式就是确保在每个k8s的node节点上创建一个pod实例,有且仅有一个实例.当node被添加到集群中,Pod也被添加上去.当node被从 ...

  9. <统计学>统计学开篇

    我们或多多少都接触学习过统计学,可统计学到底是一种什么样的学科呢? 我们将统计学定义为:对数据进行收集.整理.展示.分析和解释,以帮助人们更有效地进行决策的科学. 关于统计学的研究通常分为两类:描述统 ...

  10. linux-rsync-同步本地文件夹

    linux-rsync-同步本地文件夹 1.安装rsync: yum list rsync yum install rsync 3.使用rsync命令进行同步 rsync -av 源目录 目标目录