css 创建盒子(div)
来源:互联网 发布:冒险岛源码 编辑:程序博客网 时间:2024/06/16 06:27
盒子模型--div
一个盒子占据的控件是边框 + 内边距 + 内容区域
Margin:外边距
Width=(margin+border+padding)*2+content
一个盒子中主要的5个属性:width、height、padding、border、margin。
width是“宽度”的意思,CSS中width指的是内容的宽度,而不是盒子的宽度。
height是“高度”的意思,CSS中height指的是内容的高度,而不是盒子的高度
padding是“内边距”的意思
border是“边框”
margin是“外边距”
盒子宽度和高度
一个元素实际宽度
真实占有宽度= 左margin+左border + 左padding + width + 右padding + 右border+右margin
盒子居中margin:0 auto;
margin的值可以为auto,表示自动。当left、right两个方向,都是auto的时候,盒子居中
TIPs:
1) 使用margin:0 auto; 的盒子,必须有width,有明确的width
2) 只有标准流的盒子,才能使用margin:0 auto; 居中。
也就是说,当一个盒子浮动了、绝对定位了、固定定位了,都不能使用margin:0 auto;
3) margin:0 auto;是在居中盒子,不是居中文本。
eq:
margin:0 auto; → 让这个div自己在大容器中居中。
text-align: center; → 让这个div内部的文本居中。注意图片就是文本
阅读全文
0 0
- css 创建盒子(div)
- DIV+CSS盒子模型
- CSS+DIV 盒子模型
- 盒子模型(DIV+CSS)
- div+css盒子
- DIV+CSS两种盒子模型(W3C盒子与IE盒子)
- DIV+CSS两种盒子模型(W3C盒子与IE盒子)
- DIV+CSS 盒子的概念
- DIV+CSS基础教程:盒子模型
- div+css布局与盒子
- DIV+CSS弹性盒子布局
- 彻底弄懂CSS盒子模式(DIV布局快速入门)
- div布局快速入门(彻底弄懂CSS盒子模式)
- CSS居中(一)--div盒子水平垂直居中
- css盒子模型,div+css布局
- DIV+CSS两种盒子模型
- 简单的盒子模型Div+Css
- DIV+CSS两种盒子模型
- iOS 之IQKeyboardManager键盘的使用
- Oracle密码过期the password has expired
- 一个简单的tweepy示范(Turtioul for tweepy by python)
- linux 编程视频完整版 linux 编程视频完整版,可能你不信,但是现在真的是都免费给, 千锋教育的Linux视频课程免费下载地址: http://pan.baidu.com/s/1c13ddvE
- 机器学习之实现简单的神经网络
- css 创建盒子(div)
- python练习(一)
- TCP
- Python输出语句乱码解决方式
- java 中的 split regular | 需特别注意
- [bzoj1629][Usaco2007 Demo]Cow Acrobats
- UDP
- 剑指offer
- 指针传值易注意点