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双边距问题

  • 相关阅读:
    从 HTTP 到 HTTPS
    一条很用的MSSQL语句
    MVC中 jquery validate 不用submit方式验证表单或单个元素
    深信服务发布SSL站点
    警告: 程序集绑定日志记录被关闭(IIS7 64位系统)
    Winform中子线程访问界面控件时被阻塞解决方案
    C# Winform中执行post操作并获取返回的XML类型的数据
    vs2010 vs2012中增加JSon的支持
    WebService应用一例,带有安全验证
    C#事件、委托简单示例
  • 原文地址:https://www.cnblogs.com/frostbelt/p/2388731.html
Copyright © 2011-2022 走看看