zoukankan      html  css  js  c++  java
  • 每天CSS学习之top/left/right/bottom

    top:值域是数值或百分比,正负都可以。该值表示 距离顶部有多少像素。例如top:10px;即距离顶部10个像素。

    left/right/bottom与top如出一辙,只是方向不一样而已。

    这些属性一般配合position一起使用。只有当position的值为relative、absolute或fixed时才有效。

    注意:position为relative时,标签是基于文档流的;当position为absolute时,标签会脱离文档流。fixed和absolute一样。

    1、不管父元素或祖先元素有没有设置position属性值,当前标签的position为relative时,且给left和top属性赋值后,该标签会基于直接父元素的左上角计算,不会脱离文档流,如果该标签前面有元素,则该标签会向下移动;

    2、如果某个标签的很多祖先元素设置了position为relative/absolute/fixed,再给当前标签的position设置absolute,给left和top属性赋值后,那就基于 离得最近的设置了position的那个祖先元素 的左上角计算;

    如果祖先元素都没有设置position值,则该标签就会基于整个屏幕的左上角进行计算。

    3、针对position是fixed的标签来说,始终是基于整个屏幕来计算的。

  • 相关阅读:
    初识sql语句
    IO模型比较分析
    select,poll,epoll,selectors
    多路复用IO
    非阻塞IO
    yield-from示例
    阻塞IO(blocking IO)
    IO模型介绍
    gevent实现套接字
    gevent异步,io自动切换
  • 原文地址:https://www.cnblogs.com/williamwsj/p/7348438.html
Copyright © 2011-2022 走看看