##

     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. pytorch怎么使用定义好的模型的一部分

    Encoder代码为: .输入图片的通道nc=.ndf=. def __init__(self,isize,nz,nc,ndf,ngpu,n_exter_layers=,add_final_conv= ...

  2. "AttributeError: /lib64/libcrypto.so.1.1: undefined symbol: EVP_CIPHER_CTX_cleanup"

    以前在openssl,有 EVP_CIPHER_CTX_cleanup函数. 1.1.0版本中 替换成为EVP_CIPHER_CTX_reset 解决办法: 找到报错的文件vim /usr/local ...

  3. PL/SQL developer 开发小技能 and ash show command PL/SQL EXECUTE 以及注释

    ##sample  test windows 调试存储过程, 总体指导思想使用pl/sql test windows 调试存储过程,存储过程调试 可以用  run  to next exception ...

  4. 宣化上人:大佛顶首楞严经四种清净明诲浅释(1)(转自学佛网:http://www.xuefo.net/nr/article23/230609.html)

    唐天竺·沙门般剌密帝译 宣化上人主讲 一九八三年四月十七日晚讲于万佛圣城 四种清净明诲,真实不虚 楞严经里的四种清净明诲:断淫.断杀.断偷.断妄,是息息相关的.若犯淫戒,就容易犯杀戒,也容易犯盗戒.妄 ...

  5. 安卓apk反编译

    在win环境反编译安卓APP的.apk文件 安卓apk 反编译为 Java源码图文教程 Android安全攻防战,反编译与混淆技术完全解析(上)

  6. css代码陷阱

    1.选择器优先级 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  7. selenium IDE下载安装(For Chrome and firefox)

    安装好Firefox/cheome之后,接下来就到了正式安装Selenuim IDE的时候了. 步骤一:下载Selenuim IDE       方法一:之前从网上查到很多安装教程,都是从http:/ ...

  8. openfoam耦合liggghts安装

    本次安装基于新安装的ubuntu18.04LTS桌面版系统,用户名为ubuntu,此前未安装其他软件(进行了系统提醒的更新),安装时间为2019年9月. 安装前需确认需要安装的OpenFOAM版本,C ...

  9. Machine Learning Glossary

    http://people.seas.harvard.edu/~mgelbart/glossary.html more at:http://www.metacademy.org/list

  10. PHP与Memcached服务器交互的分布式实现源码分析

    转自: http://blog.csdn.net/hguisu/article/details/7353595 前段时间,因为一个项目的关系,研究了php通过调用memcache和memcached ...