css3-8 内外边距中的注意要点有哪些

一、总结

一句话总结:padding,border都是外延的。margin会合并。

1、两元素样式都有margin:15px,他们中间的距离是15px还是30px?

15px,因为外边距会合并

2、sublim中的格式化粘贴快捷键(一般软件的格式化键都是shift)?

ctrl+shift+v

3、盒子模型里面哪些东西属于盒子?

原来的+padding+border属于盒子,margin不属于盒子

4、div是100*100,加了padding:5px,border:5px;后,div是多大(也就是padding和border是内延还是外延)?

外延,为了不影响div里面的东西,所以是120*120

二、内外边距中的注意要点有哪些

1、相关知识

外间距:
margin-left:10px;
margin-top:10px;
margin-right:10px;
margin-bottom:10px;

margin:15px;
#上下左右

margin:5px 0px;
#上下,左右面

margin:0px 5px 5px;
#上,左右,下

margin:0px 0px 0px 15px;
#上右下左

 

css3-8 内外边距中的注意要点有哪些的更多相关文章

  1. css - 盒子内外边距

    css - 盒子内外边距 元素内边距 内边距是指元素包含的内容离元素边框之间的间距,padding会撑大盒子.在浏览器中显示的元素宽高包含了padding. div{     width:200px; ...

  2. Android UI系列-----长度单位和内外边距

    这篇随笔将会记录一下在控件布局时,设定距离的三种长度单位:px.dp.sp以及内外边距的属性 1.三种长度单位 ①px:px是我们常见的一种距离单位,它表示的是一个单位像素,我们经常说我们手机或者电脑 ...

  3. css关于内外边距的详细解释

    贴图吧,图一眼明了. 无效果时候有 只有一个<div>啦啦啦</div> 只有padding时候有: padding详细设计时: 解释:padding是对内的,如padding ...

  4. 0019 盒子模型(CSS重点):边框、内外边距、布局稳定性、PS

    typora-copy-images-to: media 第01阶段.前端基础.盒子模型 盒子模型(CSS重点) css学习三大重点: css 盒子模型 . 浮动 . 定位 主题思路: 目标: 理解: ...

  5. 学习微信小程序之css11内外边距集合

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. css内外边距属性

    盒子模型: 所有HTML元素可以看作盒子,在CSS中,"box model"是用来设计和布局时 使用. CSS盒模型本质上是一个盒子, 封装周围的HTML元素, 它包括:边距,边框 ...

  7. CSS 内外边距 float positio属性

    一.外边距和内边 margin:            用于控制元素与元素之间的距离 外边距:margin的最基本用途就是控制元素周围空间的间隔,从视觉角度上达到相互隔开的目的. padding:   ...

  8. css盒模型。边框和内外边距

    css盒模型: 外边距 边框 内填充 内容 盒模型分为两种: 标准盒模型: 怪异盒模型(IE盒模型): 边框:border border: 10px solid blue;表示设置10像素蓝色实线条的 ...

  9. css样式之边框和内外边距

    1.css样式之边框:border 实心的边框: <!DOCTYPE html><html> <head> <meta http-equiv="co ...

随机推荐

  1. 阿姆达尔定律(Amdahl's law)

    首先给出阿姆达尔定律的数学公式描述: S(N)=1(1−p)+pN p:程序中可并行部分的程序在单核上执行时间的占比: N:处理器的数目(总的核心数) S(N):程序在 N 个处理器(总核心数)相对在 ...

  2. [Javascript AST] 2. Introduction: Write a simple ESLint rule

    What we want to do is checking if user write nested if statements which actually can combine to one: ...

  3. amazeui学习笔记二(进阶开发1)--项目结构structure

    amazeui学习笔记二(进阶开发1)--项目结构structure 一.总结 1.项目结构:是说的amazeui在github上面的项目结构,二次开发amazeui用 二.项目结构structure ...

  4. Logstash Json 过滤器插件

    1. Json Filter 功能概述 这是一个JSON解析过滤器.它接受一个包含JSON的现有字段,并将其扩展为Logstash事件中的实际数据结构. 默认情况下,它将把解析过的JSON放在Logs ...

  5. python投票统计程序,统计序列中各个数值的份数,字典的应用。

    这里可能会用到字典的知识, 字典主要是用来存储最后的统计结果. 字典的用法:http://www.runoob.com/python/python-dictionary.html https://ww ...

  6. amazeui学习笔记--css(常用组件12)--面板Panel

    amazeui学习笔记--css(常用组件12)--面板Panel 一.总结 1.面板基本样式:默认的 .am-panel 提供基本的阴影和边距,默认边框添加 .am-panel-default,内容 ...

  7. Android 一个异步SocketHelper

    发送流程:首先定义一个缓冲池,发送数据时仅仅是将待发送的数据加入到缓冲池中,再由后台的工作线程从缓冲池中取得待发送数据进行发送.可能某些情况下在数据发送完成时需要做一些处理(比如写日志),便定义了一个 ...

  8. 关于Clipboard和GlobalAlloc函数的关系

    一句话:为了满足进程间通信,使用了clipboard的方法,clipboard是系统提供的一段任何进程都可以访问的公共内存块,malloc 和new分配的动态内存块是在进程的私有地址空间分配的,所以必 ...

  9. 错误代码: 1449 The user specified as a definer (&#39;root&#39;@&#39;%&#39;) does not exist

    1. 错误描写叙述 1 queries executed, 0 success, 1 errors, 0 warnings 查询:call analyse_use('20150501','201506 ...

  10. screenX, clientX, pageX

    screenX:鼠标相对屏幕左上角的水平偏移量. clientX:鼠标相对于浏览器左上角的水平偏移量,会随着滚动条的移动而移动. pageX:鼠标相对浏览器左上角的水平偏移量.不会随着滚动条的移动而移 ...