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. Windows 98 二十岁了，这些功能都是从它开始的（虽然 Windows 98 不如 Windows 95 那样具有革命性，但完成度更高，更加成熟。到最后还是：相见不如怀念。）

    1998 年 6 月 25 日午夜,美国著名连锁零售店 CompUSA 门外挤满了狂热的消费者和媒体,他们在等待一款软件发售:Windows 98,即使明知它要到当天早上才正式上市. ▲ 在 Comp ...

  2. SSH密码错误几次后封禁登录IP

    #!/bin/bash yum -y install vixie-cron crontabs mkdir -p /usr/local/cron/ cat > /usr/local/cron/ss ...

  3. 1.3 Quick Start中 Step 8: Use Kafka Streams to process data官网剖析（博主推荐）

    不多说,直接上干货! 一切来源于官网 http://kafka.apache.org/documentation/ Step 8: Use Kafka Streams to process data ...

  4. go timer

    go timer package main import ( "fmt" "time" ) func debounce(interval time.Durati ...

  5. CISP/CISA 每日一题 八

    CISA 每日一题(答)网关执行电子邮件格式转换 电子邮件安全——加密 大文件——对称加密 不可否认——非对称 哈希——完整性     电子银行主要风险: 战略.经营和声誉上的风险 双SSP每日一题 ...

  6. Android系统如何管理自己内存的？

    本文来自http://blog.csdn.net/liuxian13183/ ,引用必须注明出处! 机缘巧合写下这篇博客,作为个人工作经验的总结,不足之处,随后补上. 安卓是基于Linux2.6内核的 ...

  7. C语言速度优化之指针赋值与if推断

    近期在写的一个项目须要优化处理速度,我写了一下程序来測试指针赋值与指针推断的速度比較.结果让我大吃一惊. #include <stdio.h> #include <stdlib.h& ...

  8. windows和Linux内存的对齐方式

    一.内存对齐的初步解说 内存对齐能够用一句话来概括: "数据项仅仅能存储在地址是数据项大小的整数倍的内存位置上" 比如int类型占用4个字节,地址仅仅能在0,4,8等位置上. 例1 ...

  9. ios系统和某些移动端background-attachment:fixed不兼容性

    固定背景不动:background-attachment:fixed; ios系统和某些移动端background-attachment:fixed不兼容性,没有任何效果,但可以hack一下就可以了, ...

  10. 调色板原理 & 编程

    调色板原理 & 编程 逻辑调色板结构LOGPALETTE,该结构定义如下: typedef struct tagLOGPALETTE { WORD palVersion; //调色板的板本号, ...