您现在的位置是：网站首页> 编程资料编程资料

css的三种定位方式使用探讨CSS Transition通过改变Height实现展开收起元素从QQtabBar看css命名规范BEM的详细介绍css实现两栏布局，左侧固定宽，右侧自适应的多种方法CSS 实现Chrome标签栏的技巧CSS实现两列布局的N种方法CSS实现隐藏搜索框功能(动画正反向序列)CSS3中Animation实现简单的手指点击动画的示例详解CSS中的特指度和层叠问题详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)关于CSS浮动与取消浮动的问题

2021-09-07 849人已围观

简介 css的3种类型定位方式，默认使用普通流技术再页面中布局元素，希望表现与普通流不同，另外两个特性position和float，下面有个不错的示例，大家可以参考下，希望对大家有所帮助

css 3种类型定位方式，进行控制页面布局：普通定位，浮动定位，绝对定位。

默认使用普通流技术再页面中布局元素，希望表现与普通流不同，另外两个特性position和float

具体实例

复制代码

代码如下:

<br>css定位功能探索 <br>

position 值为relative 定位探索1

position 值为relative 定位探索2

position 值为absolute 定位探索3

position 值为absolute 定位探索4

这是position 值为absolute 定位探索4和5的父元素

position 值为absolute 定位探索4

position 值为absolute 定位探索5

这是position 值为absolute 定位探索6和7的父元素

position 值为absolute 定位探索6

position 值为absolute 定位探索7

这是position值为fixed 定位探索1

这是position值为fixed 定位探索2

这是一个普通定位1

这是float定位1

这是float定位2

这是一个普通定位2

运行效果：