content

padding

border

margin

可以理解为在商场上看到的电视机。

电视机------content

装电视机的箱子边框有粗细------border

电视机与箱子之间的泡沫-------padding

一台电视机与另一台电视机的距离-----margin

content为电视机，padding为电视机与箱子之间的泡沫，border为装电视机的箱子厚度，margin当前这台电视机与其他电视机的距离

position

relative        相对   相对原来的位置移动   原位置保留

absolute       绝对　相对最近的非标准流盒子移动　原位置不保留，被填充    变为块级框

static           默认　left right不生效了

fixed　　　　相对窗口本身

inherit         继承

css盒子模型和定位的更多相关文章

  1. css盒子模型，定位，浮动

    1.盒子模型 Margin(外边距) - 清除边框外的区域,外边距是透明的. Border(边框) - 围绕在内边距和内容外的边框. Padding(内边距) - 清除内容周围的区域,内边距是透明的. ...

  2. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性　　定位（position）z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  3. 深入理解CSS盒子模型

    在CSS中浮动.定位和盒子模型,都是很核心的东西,其中盒子模型是CSS很重要基石之一,感觉还是很有必要把CSS盒子模型相关知识更新一下...... CSS盒子模型<BoxModel>示意图 ...

  4. 每天学点前端——基础篇1：css盒子模型，绝对定位和相对定位

    什么是css盒子模型(Box Model)? W3C中解释为:规定了元素框处理元素内容.内边距.边框和外边距的方式: MDN:文档中的每个元素被描绘为矩形盒子.渲染引擎的目的就是判定大小,属性--比如 ...

  5. 几个容易出错的css盒子模型细节

    css是前端必须掌握的技能之一.其中的box模型,如图所示: 大体就是border.margin.padding和content,概念挺好理解.但当盒子模型与其他属性一块使用时产生的现象,或许您还难以 ...

  6. <转>HTML+CSS总结/深入理解CSS盒子模型

    原文地址:http://www.chinaz.com/design/2010/1229/151993.shtml 前言:前阵子在做一个项目时,在页面布局方面遇到了一点小问题,于是上stackoverf ...

  7. 聊聊css盒子模型

    css盒子模型原理: 在网页设计中常听的属性名:内容(content).填充/内边距(padding).边框(border).外边距(margin), CSS盒子模式都具备这些属性. 这些属性我们可以 ...

  8. CSS盒模型和定位的类型

    此文根据Steven Bradley的<How Well Do You Understand CSS Positioning?>所译,整个译文带有我自己的理解与思想,如果译得不好或不对之处 ...

  9. [Web 前端] CSS 盒子模型，绝对定位和相对定位

    cp : https://blog.csdn.net/web_yh/article/details/53239372 一.盒子模型: 标准模式和混杂模式(IE).在标准模式下浏览器按照规范呈现页面:在 ...

随机推荐

  1. Bleve代码阅读（一）——新建索引

    引言 Bleve是Golang实现的一个全文检索库,类似Lucene之于Java.在这里通过阅读其代码,来学习如何使用及定制检索功能.也是为了通过阅读代码,学习在具体环境下Golang的一些使用方式. ...

  2. Oracle——存储过程的使用

    为什么使用存储过程? 存储过程只在创造时进行编译,以后每次执行存储过程都不需再重新编译,而一般SQL语句每执行一次就编译一次,所以使用存储过程可提高数据库执行速度. 存储过程的定义: 存储过程(Sto ...

  3. jquery选择器最后一个，倒数第二个元素

    <div> <p>1</p> <p>2</p> <p>3</p> <p>4</p> < ...

  4. NFS配置不当导致的那些事儿

    NFS(Network File System):是FreeBSD支持的文件系统中的一种,它允许网络中的计算机之间通过TCP/IP网络共享资源: NFS配置:(声明:以下NFS实验是在RedHat7上 ...

  5. 2017-2018-2 20155303 『网络对抗技术』Exp3：免杀原理与实践

    2017-2018-2 20155303 『网络对抗技术』Exp3:免杀原理与实践 --------CONTENTS-------- 1. 免杀原理与实践说明 实验说明 基础问题回答 2. 使用msf ...

  6. CentOS 6.5下快速搭建ftp服务器[转]

    CentOS 6.5下快速搭建ftp服务器 1.用root 进入系统 2.使用命令 rpm -qa|grep vsftpd 查看系统是否安装了ftp,若安装了vsftp,使用这个命令会在屏幕上显示vs ...

  7. nrm安装与使用

    1.什么是nrm nrm是一个npm源管理工具,使用它可以快速切换npm源. 2.安装 使用如下命令安装: npm install -g nrm 安装完后可使用 nrm -V 显示版本,注意是大写V. ...

  8. 嵌入式Linux驱动笔记(十八)------浅析V4L2框架之ioctl【转】

    转自:https://blog.csdn.net/Guet_Kite/article/details/78574781 权声明:本文为 风筝 博主原创文章,未经博主允许不得转载!!!!!!谢谢合作 h ...

  9. OpenWrt启动过程分析+添加自启动脚本【转】

    一.OpenWrt启动过程分析 转自: http://www.eehello.com/?post=107 总结一下OpenWrt的启动流程:1.CFE->2.linux->3./etc/p ...

  10. 实现开发板与ubuntu的共享--根文件系统NFS--Samba共享【sky原创】

    虚拟机要选择桥接,并且禁用有线和无线网卡,开启本地连接,本地连接属性要写如下:     ip地址是在连上板子后,windows   cmd  下  ipconfig得出的 板子的网线最好连接交换机或者 ...