CSS3学习笔记(二)2015-12-9【从新浪云搬运】
来源:互联网 发布:java android api 编辑:程序博客网 时间:2024/06/06 03:30
CSS定位
改变元素在页面上的位置
cssd定位机制
普通流:元素按照其在HTML中的位置顺序决定排布的过程
浮动:
绝对布局
CSS定位属性
position :把元素放在一个静态的、相对的、绝对的、或固定的位置中
static:偏移量不起任何效果
relative:相对布局
absolute:绝对布局,相对与其他元素,不占位置了
fixed:不管当前页面如何变化,他都不动
top: 元素向上的偏移量
left: 元素向左的偏移量
right:元素向右的偏移量
bottom:元素向下的偏移量
overflow:设置元素溢出其区域发生的事情
clip:设置元素显示的形状
vertical-align:设置元素垂直对齐方式
z-index:设置元素的堆叠顺序,谁的值大,谁在上面
浮动:
float属性可用的值
left:元素向左浮动
right:元素向右移动
none:元素不浮动
inherit:从父级继承浮动属性
clear属性:
去掉浮动属性(包括继承来的属性)
clear属性值
left、right:去掉元素向左、向右浮动
both:左右两侧均去掉浮动
inherit:从父级继承来的clear的值
css3的盒子模型
内边距
属性:
padding:设计所有边距
padding-left:设置左边距
padding-bottom:设置底边距
padding-right:设置右边距
padding-top:设置上边距
边框:
边框的样式border-style
10种
边框的单边框样式
border-to-style
边框的宽度
border-width :10px;
单边框宽度:border-top-width
边框的颜色:
border-color
border-top-color
css3边框:
border-radius:圆角边框
box-shadow:边框阴影
border-image:边框图片
外边距:
外边距接受任何长度单位、百分数值
常用属性:
margin:设置所有边距
margin-bottom :设置底边距
margin-left :设置左边距
margin-right:设置右边距
margin-top设置上边距
外边距合并
css常用操作
对齐
使用margin属性进行水平对齐
使用position属性进行左右对齐
使用float属性进行左右对齐
分类
1尺寸操作
height:设置元素高度
line-height:设置行高
max-height:设置元素最大高度
max-width:设置元素最大宽度
min-width:设置元素最小高度
min-height:设置元素最小高度
width:设置元素宽度
2分类操作
clear:设置一个元素的侧面是否允许其他的浮动元素
cursor:规定当指向某元素之上时显示的指针类型(鼠标指向时显示方式)
display:设置是否及如何显示元素
float:定义元素在哪个方向上浮动
position: 把元素放置到一个静态的、相对的、绝对的、固定的位置
visibility :设置元素是否可见或不可见
- CSS3学习笔记(二)2015-12-9【从新浪云搬运】
- HTML5学习笔记(一)(2015-12-2)【新浪云搬运】
- photoshop学习笔记(一)2015-12-4【新浪云搬运】
- HttpClient发送Get请求(java)【从新浪云搬运】
- Android判断网络连接是否可用【从新浪云搬运】
- css3学习笔记(二)
- HTML5与CSS3学习笔记(二)
- CSS学习笔记(二)--CSS3的学习
- Css3学习笔记(二):在页面中插入内容
- CSS3学习笔记(二)之CSS转换
- CSS3属性笔记(二)
- CSS3学习笔记(一)--2015-12-3
- (2011-12-29 旧博文搬运)as3笔记
- [个人博客搬运]ReactiveCocoa学习笔记
- 【读书笔记】CSS3学习(二)
- CSS3学习笔记(一)
- css3学习笔记(一)
- css3学习笔记(一)
- vi编辑器常用操作命令汇总
- PageBean
- ImageFont Module
- iOS离屏绘制的性能和机制分析
- 编写将一个包含有20个数据的数组M分成两个数组,正整数数组P和负数数组N ,分别把这两个数组中的数据的个数显示出来
- CSS3学习笔记(二)2015-12-9【从新浪云搬运】
- 最火爆的开源流式系统Storm vs 新星Samza
- binder第二课
- HDU 5654 xiaoxin and his watermelon candy
- 关于大型网站技术演进的思考(十四)--网站静态化处理—前后端分离—上(6)
- 挖掘DBLP作者合作关系,FP-Growth算法实践(5):挖掘研究者合作关系
- 文档词频分析小工具
- 关于大型网站技术演进的思考(十三)--网站静态化处理—CSI(5)
- UVa 340 - Master-Mind Hints