• 【总结整理】行内标签span设置position:absolute/float属性可以设置宽度与高度


    postion:absolute 跳出文本流,不是行内元素,设置宽高有效,我的理解。

    引用下曹刘阳写的《编写高质量代码-web前端开发修炼之道》一书中看到的一句话:
    position:absolute和float会隐式地改变display类型,不论之前什么类型的元素(display:none除外),
    只要设置了position:absolute、
    float中任意一个,都会让元素以display:inline-block的方式显示:可以设置长宽,默认宽度并不占满父元素。


    postion属性一共有4个值,分别为static,absolute,relative和fixed。
    (1)static为默认值,它表示块保持在原本应该在的位置上,即改值没有任何移动的效果。

    (2)当子块的postion值设为absolute时子块已经不再从属于父块。
    注:top,right,bottom和left这4个css属性,他们都是配合position属性使用的,不但可以设置为绝对像素,也可以设置为表分数,
    表示块的各个边界离页面边框(postion=absolute)的距离,或者各个边界离原来位置(postion=relative)的距离。
    只有当postion属性设置为absolute或者relative时才能生效。如果设置为static,则子块不会有任何变化

    (3)块的postion设置为relative时,与将其设置为absolute时完全不同。这时子块是相对于其父块来进行定位的,同样配合top,right,bottom和left这4个属性来使用的

    1. 设置absolute会使得inline元素被“块”化,这在上一节将display时已经说过;
    2. 设置absolute会使得元素已有的float失效。不过float和absolute同时使用的情况不多;
    3. 上文提到了absolute会使元素悬浮在页面之上,如果有多个悬浮元素,层级如何确定?答案是“后来者居上”


  • 相关阅读:
    [Clr via C#读书笔记]Cp4类型基础
    [Clr via C#读书笔记]Cp3共享程序集和强命名程
    [Clr via C#读书笔记]Cp2生成打包部署和管理应用程序和类型
    [Clr via C#读书笔记]Cp1CLR执行模型
    试用Markdown来写东西
    字符编码的总结
    常去的网站
    Click Once使用总结
    【LevelDB源码阅读】Slice
    【程序员面试金典】面试题 01.05. 一次编辑
  • 原文地址:https://www.cnblogs.com/lianghong/p/8022911.html
Copyright © 2020-2023  润新知