css基础学习----定位

原创 2017年01月03日 23:31:06

定位

定位:定义元素框相对于其正常位置应该出现的位置,或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。

分类:普通流定位、浮动定位、相对定位、绝对定位

 

定位属性

 

普通流定位:块级元素,每一个元素都会出现在一个新行中;内联元素,每一个元素将在一行中从左到右排列水平位置。

浮动定位:浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。

下面的图示展示了几种浮动定位的示例。

 


float:none|left|right   设置框浮动在包含框的左边或者右边


clear:none|left|right|both    用于清除浮动所带来的影响,定义了元素的哪边上不允许出现浮动元素。

相对定位:元素仍保持其未定位前的形状,元素框会相对于它原来的位置偏移某个距离。


关于无线定位技术 学习过程

无线定位,首先,得能
  • Openthedr
  • Openthedr
  • 2014年08月30日 13:11
  • 1523

前端基础学习-常见CSS网页布局

常见的网页布局大致分为:一列布局,两列布局,三列布局以及混合布局一列布局 Document .header{ height: 8...
  • dingshuhong_
  • dingshuhong_
  • 2016年03月10日 11:12
  • 1110

百度地图学习(一):定位

希望能和大家多多交流
  • CuriousX
  • CuriousX
  • 2016年10月05日 09:25
  • 981

学习HTML时所遇到的问题

第一次写代码,期间也走了不少的弯路,也暴露了好多问题,关于我所遇到的问题总结如下:  一:没有把公共的CSS代码放到一个公共的CSS文件夹里面,网页里面的导航和页脚基本都是相同的,所以把他们放到一个...
  • JYHaaaa
  • JYHaaaa
  • 2018年02月06日 08:51
  • 17

CSS定位之——什么是包含块?

一、包含块简单说就是定位参考框或者定位坐标参考系,元素一旦定义了定位显示(相对、绝对、固定)都具有包含块性质,它所包含的定位元素都将以该包含块为坐标系进行定位和调整。 二、包含块是视觉格式化模型的一个...
  • hangxingkong
  • hangxingkong
  • 2017年02月06日 16:52
  • 1356

CSS之四种定位的理解

Static 这个是元素的默认定位方式,元素出现在正常的文档流中,会占用页面空间。不能使用top,bottom,left,right和z-index。 Relative 相对定位方式,相对于其...
  • Mr_28
  • Mr_28
  • 2017年02月03日 14:18
  • 2933

CSS快速学习7:定位锚点

定位锚点: 一、position 定位属性,检索对象的定位方式; 语法:position:static /absolute/relative/fixed   取值: 1、static:默认值...
  • zhongguohaoshaonian
  • zhongguohaoshaonian
  • 2016年08月25日 08:46
  • 1775

CSS基础-19CSS定位-定位

html> lang="en"> charset="UTF-8"> href="css01.css" type="text/css" rel="stylesheet"> ...
  • zhaihaohao1
  • zhaihaohao1
  • 2015年08月01日 17:08
  • 161

CSS三大定位原理&Z-index解析

一、理解定位(static是默认的)原始图—不加定位1.absolute(绝对定位) 1.脱离标准流,在页面中不占位置(浮起来) 2.如果没有父元素,则相对于body定位;如果有父元素,但父...
  • w_linux
  • w_linux
  • 2017年03月29日 22:18
  • 1023

css基础代码库整理

重置-reset.css由于考虑到重置样式会存在潜在的问题,例如我们在全局将strong变成了一个普通标记,在用户可编辑内容区域的strong就不会反应出效果来,用户就会产生很大的疑惑,为什么在编辑器...
  • ImagineCode
  • ImagineCode
  • 2016年06月19日 17:55
  • 599
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:css基础学习----定位
举报原因:
原因补充:

(最多只允许输入30个字)