zoukankan      html  css  js  c++  java
  • hmtl 中的定位

    1.绝对定位:

                  position:sbsolute;

                       作用:将元素从文档流中拖出来,然后使用 left,right,top,bottom属性相对于其最接近的一个具有定位属性的父包含块进行绝对定位。

                                若不存在这样的包含块,则相对于Body元素,即相对于浏览器窗口。      

    2.相对定位:

                 position:relative;

                      作用:通过 left,right,top,bottom属性确定元素在正常文档流中的偏移位置。相对定位完成的过程,是首先按(static)方式生成一个

                               元素。并且元素层一样浮动起来,然后相对于以前的位置移动,偏移的方向和幅度由left,right,top,bottom属性确定,偏移前的

                               位置保留不变。

    3.相对定位与绝对定位的组合使用:

                      参照定位元素必需是相对定位元素的前辈元素。参照定位的元素必需加入position:relative。定位元素加入 position:sbsolute,可以

                      用top,bottom,left,right进行定位。

    HTML文档流解释:
          HTML元素可分为两大类;内联元素和块级元素.二者在显示方式上是不同的.
          内联是在水平方向上一个拦一个元素排列的,元素前后不产生换行,元素间的水平间距可以通过水平方向上的填充,边框和间距来控制,觉的strong,span等就属于内联元素,需要注意的是,竖直方向上的填充,边框和间距对控制内联元素的高度是不起作用的,水平方向的一行将构成一个所谓的line box,这是一个逻辑上的概念,line box是一个虚拟的矩形区域,包含了组成这行的所有内联元素,其高度本行内所有内联元素内容完全显示出来,尽管浏览器自动计算内联元素高度,我们还是可以通过设置line-height属性的值来改变元素的高度.
         块级元素是在竖址方向上一个接一排列的,元素前后均产生换行,竖直方向上元素之间的距离可以用上下边距来控制,注意竖直方向的边距会产生重叠,其间距值取相邻元素中边距较大的那一个,常见p,div等都是块级元素,这些元素的内容都 是以块的形式显示在浏览器中,
         内联元素和块级元素各自遵循着不同的显示方式,这就构成了html的文档, 文流档的内容被比喻为流,文档中的元素可以随波流,也可以脱离流,漂浮在其上,如果你没有为元素设定附加css属性,那么元素将按照它在html代码中出现的顺序一个挨着一地排列.
     
  • 相关阅读:
    Shell编程-05-Shell中条件测试与比较
    Shell编程-04-Shell中变量数值计算
    Shell编程-03-Shell中的特殊变量和扩展变量
    Shell编程-02-Shell变量
    Shell编程-01-Shell脚本初步入门
    Windows与Linux相互远程桌面连接
    awk基础05-自定义函数和脚本
    使用Kafka Connect创建测试数据生成器
    设置KAFKA
    Apache Kafka使用默认配置执行一些负载测试来完成性能测试和基准测试
  • 原文地址:https://www.cnblogs.com/liaolei1/p/5374325.html
Copyright © 2011-2022 走看看