zoukankan      html  css  js  c++  java
  • css 盒模型 hasLayout position float

    hasLayout是IE为解析盒模型而设计的一个专有属性,它的设计初衷是用于块级元素的,如果触发行内元素的hasLayout,就会让行内元素拥有一些块级元素的特性。

    display:inline-block  有width,height,margin,padding  却不独占一行,很好

    但IE6,7不支持inline-block,inline-block只能触发IE6,7下行内元素的hasLayout

    即:IE6,7下,设置inline-block的块级元素:白设

                                                行内元素:可设width,height...  效果同zoom:1

    例:abcde<span>12345</span>  span{display:inline-block;height:30px;100px;background:#ccc;}

    ie6/7

    ie8/ff

    为兼容顶对齐:span{*vertical-align:-10px;_vertical-align:-10px;} 值根据需要自己设

    img button很超然,可设长宽但却不独占一行

    *****************************************************************************************************************************

    position:relative absolute都可以激活left top rigth bottom 和 z-index属性

    文档流:元素根据自己的display类型、长宽、内外边距等属性顺序排列在z-index:0这一层里。

    relative absolute都会让元素浮起来,z-index>0

    relative 会保留自己在z-index:0层的点位,left top ... 都是相对自己原有的位置

    absolute 不保留自己原来位置,left top ... 是相对于距自己最近的一个设置了relative或absolute的祖先元素的位置偏移。找不到祖宗就找body

    float仍然让元素在z-index:0层流动,会改变正常的文档流,影响周围元素。

    relative 不会改变元素display类型;absolute和float会让元素以inline-block方式显示。再显示地设置display为inline/block也无效。

    {float:left; display:inline}可解决IE6双边距问题

  • 相关阅读:
    jchdl
    jchdl
    UVa 10256 (判断两个凸包相离) The Great Divide
    UVa 11168 (凸包+点到直线距离) Airport
    LA 2572 (求可见圆盘的数量) Kanazawa
    UVa 10652 (简单凸包) Board Wrapping
    UVa 12304 (6个二维几何问题合集) 2D Geometry 110 in 1!
    UVa 10674 (求两圆公切线) Tangents
    UVa 11796 Dog Distance
    LA 3263 (平面图的欧拉定理) That Nice Euler Circuit
  • 原文地址:https://www.cnblogs.com/frostbelt/p/2388731.html
Copyright © 2011-2022 走看看