zoukankan      html  css  js  c++  java
  • CSS关于位置布局

    平常布局

    关于fixed。

    fixed所在的div层,会在整个可视界面定位,不会随滚动条而移动,始终处在你所能看见的界面的相应位置

    (相当于你在电脑屏幕上贴了一张纸贴,你的电脑在上下移动,但在电脑屏幕上的纸贴却随电脑而动,在屏幕上贴着的纸还是在那里贴着。)

    fixed所在的div层也不会随窗口的变化而移动位置,比如这个div层在窗口右上角,窗口缩小后,这个div层还在窗口右上角,大小也不改变。

    关于relative。

    首先,relative的两个层,呈现上下分布,在浏览窗口界面定位,随滚动条下移,relative和普通层一样,不会在显示。

    relative层中,(relative层所代表的就是和普通层一样,被分配到相应的位置,即相应的格中,随着显示的元素位置的改变,那个被分配到的格是不会改变的

    ----比如下方第三层图中,绿和蓝之间的空白层,就是蓝本来被分配到的位置,但蓝元素上移后,格还在,就会显示空白-----无元素):

    想要上移,top必须为负;想要下移,top为正;(所遗留的空白均显示此处无元素)

    不动的话,top为0;(可不写)

    关于absolute。

    一般情况下,absolute属性的显示要求div层中套div层。

    0.第一层div层absolute,position后的属性使div元素效果以整个页面为坐标进行定位。

    第二层div层没有absolute,元素效果也是以页面为主,从头显示效果。(如下方第一层图片)

    1.若内层的div层没有absolute属性,外层的div层absolute属性,外层的div元素效果以整个页面为坐标进行定位。

    position下的属性规定的效果以浏览页面为主。(如下方第二层图片)

    2.若外层的div层没有absolute属性,内层的div层absolute属性,内层的div元素效果以整个页面为坐标系进行定位。

    position下的属性规定的效果以浏览页面为主。(如下方第三层图片)

    3.外层中position是absolute(其实fixed、relative都行),后面没有position的下属性;内层中position是absolute,后面是position的下属性,

    内层div中的元素效果会以外层的div为坐标进行定位。(如下方第四层图片)

  • 相关阅读:
    Android获取视频音频的时长的方法
    Android动画效果之Frame Animation(逐帧动画)
    去除自定义Toolbar中左边距
    Android Toolbar样式定制详解
    Android 5.x Theme 与 ToolBar 实战
    Android ToolBar 使用完全解析
    Android开发:最详细的 Toolbar 开发实践总结
    SpannableString 转换局部字体大小,但在EditText测量之前设置内容,测量高度为,字体变小之前的高度
    android在Service中弹出Dialog对话框,即全局性对话框
    Could not find com.android.tools.build:gradle:3.0.0-alpha3
  • 原文地址:https://www.cnblogs.com/xianshui/p/4437379.html
Copyright © 2011-2022 走看看