定位

作者: 星河入怀fd | 来源:发表于2019-05-30 20:24 被阅读0次

1.定位:

position属性可以控制Web浏览器如何以 及在何处显示特定的元素。可以使用position属性把一个元素放置到网 页中的任何位置。

可选值:static    relative

absolute    fixed

2.相对定位:将position属性设置为relative时,则开启了元素 的相对定位。

使用top、right、  bottom、left四个属性对元素进行定位

3.相对定位的特点

如果不设置元素的偏移量,元素位置不会发生改变。

相对定位不会使元素脱离文本流。元素在文本流中 的位置不会改变。

相对定位不会改变元素原来的特性。

相对定位会使元素的层级提升,使元素可以覆盖文 本流中的元素。

4.绝对定位:将position属性设置为absolute时,则开启 了元素的绝对定位

使用top、right、 bottom、left四个属性对元素进行定位

5.绝对定位的特点

绝对定位会使元素完全脱离文本流。

绝对定位的块元素的宽度会被其内容撑开。

绝对定位会使行内元素变成块元素。

一般使用绝对定位时会同时为其父元素指定一 个相对定位,以确保元素可以相对于父元素进 行定位。

6.固定定位:将position属性设置为fixed时,则开启了元素的 固定定位。

使用top、right、bottom、left四个属性对元素进行定位   固定定位的其他特性和绝对定位类似

7.z-index:元素开启定位以后就可以设置z-index

值越 大元素显示的优先级越高,也就是z-index 值较大的元素会显示在网页的最上层。

8.解决高度塌陷

bfc 

1.开启后具有的特性:父元素的垂直外边距不会和子元素重叠

2.开启的bfc元素不会被浮动元素所覆盖

3.开启bfc元素可以包含浮动的子元素

如何开启这个元素的bfc

1.设置元素浮动

2.设置元素的绝对定位

3.设置元素为inline-block

4.将元素的overflow设置为一个非visible的值 (overflow:hidden)

hosloyout(IE)

zoom: (写几放大几倍;)

相关文章

  • 定位,定位,还是定位

    要想成为一个好的文字的输出者,首先要给自己一个合理的定位。定位可以首先想象自己想成为的角色:一个能够通过各种故事启...

  • 10-CSS定位流

    定位流 定位流分类相对定位绝对定位固定定位静态定位 相对定位 什么是相对定位?相对定位就是相对于自己以前在标准流中...

  • CSS中的几种定位

    CSS中常用的定位有 普通定位,相对定位 绝对定位、fixed定位 浮动 1、普通定位和相对定位 css中的元素有...

  • 2017-02-23 CSS 学习笔记

    定位流 定位流分类 相对定位 绝对定位 固定定位 静态定位 什么是相对定位相对定位就是相对于自己以前在标准中的位置...

  • #30天专注橙长计划#品牌定位30(6)营销推广1

    品牌定位的维度包括: 市场定位、价格定位、形象定位、地理定位、人群定位、渠道定位等; 经过前期大量的市场调研工作,...

  • D28:系统地图, 高德地图

    目录一. 定位功能 iPhone手机定位(基站定位, WiFi定位, GPS定位: 定位所需时间递增, 精确度递增...

  • 相对定位、绝对定位和固定定位

    1. 相对定位 定位有三种:相对定位,绝对定位、固定定位。 相对定位: position:relative lef...

  • 定位流

    定位流指的是:相对定位(relative)/绝对定位(absolute)/固定定位(fixed) 不包括静态定位(...

  • CSS补充2

    定位position 定位分为四种:相对定位 relative,绝对定位 absolute,固定定位 fixed,...

  • 定位

    1、static定位(普通流定位) -------------- 默认定位 2、float定位(浮动定位) 例:f...

网友评论

      本文标题:定位

      本文链接:https://www.haomeiwen.com/subject/uskbtctx.html