zoukankan      html  css  js  c++  java
  • css/html布局技巧及兼容问题(小部分知识)

    IE6IE7中,行高值必须大于字体的2px以上才能保证字体的完整显示或当作为链接时能显示下划线。
    IE6 下去掉 input等元素 的边框 border: 0 none; 所有浏览器都可以了
    边框1px {td不重叠状态} border-collapse: collapse;table、td需同时设置)
    IE6、7边框断续 {min-height:1px; _height:1px;}或{zoom:1;overflow:hidden;}均可解决
    IE6、7、8 FF 兼容透明 filter:alpha(opacity=70);-moz-opacity:0.7;opacity: 0.7;
    IE6、7、8 FF 浏览器兼容虚线框 a{outline:none; blr:expression(this.onFocus=this.blur());}/*ie输入框input输入法不能切换*/
    文字中间横线 text-decoration:line-through;{360.00}
    css3投影效果 文字{text-shadow:1px -1px 1px #970505;} 盒子{box-shadow:2px 2px 2px #fff;}
    三角写法 border-color: #3FA7CB #3FA7CB #3FA7CB #FFFFFF;/*四角*/ border-style: solid;
    border- 4px; font-size: 0; height: 0; line-height: 0; 0;
    文字省略号css样式 text-overflow:ellipsis ;{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap;315px; }必备条件
    font简写 css样式  600{加粗} 12px{字号}/30px{行距}  "Microsoft YaHei",微软雅黑{字体}
    textarea输入框设置  resize:none;overflow-y: auto;竖条显示无
    图片垂直居中代码css display: table-cell; overflow: hidden;text-align: center;vertical-align: middle;
    /*兼容ie6-7*/{+display:block;+font-size:300px;+font-family:"Times New Roman", Times, serif;}
    中文字间距 letter-spacing: 50px;{可取正负值}
    Div最小高度兼容IE6 height:100px;overflow:visible;{min-height:100px;height:auto !important;}IE7、8 FF兼容
    Position:relative定位问题针对IE6 (1)给父层设置zoom:1;触发layout;  (2)给父层设置width或height
       
    锚链接 <a href="#56">点击链接图</a> <a id="56" >连接到的内容</a>
    position:fixed不兼容ie6设置 正常设置:position:fixed;100%;left:0;bottom:0px;
    Ie6设置下:<!--[if IE 6]>  <style type="text/css">  html{overflow:hidden;}  body{height:100%;overflow:auto;}  类名{position:absolute;right:17px;} </style> 
    <![endif]-->
    内页里:*html{background-image:url(about:blank);background-attachment:fixed;}/*解决IE6下滚动抖动的问题*/
    .类名{_position:absolute;_bottom:auto;_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));_margin-bottom:0px;}
    使用IE特有的条件判断语句: <!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->
    <!--[if IE]> 所有的IE可识别 <![endif]-->
    <!--[if IE 6]> 仅IE6可识别 <![endif]-->
    <!--[if lt IE 6]> IE6以下版本可识别 <![endif]-->
    <!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
    <!--[if IE 7]> 仅IE7可识别 <![endif]-->
    <!--[if lt IE 7]> IE7以下版本可识别 <![endif]-->
    <!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->
    <!--[if IE 8]> 仅IE8可识别 <![endif]-->
    <!--[if IE 9]> 仅IE9可识别 <![endif]-->
  • 相关阅读:
    redis 操作使用
    sublime 设置像IDE一样的 ctrl+鼠标左键 跳转到定义方法
    tensorflow进阶篇-5(反向传播2)
    tensorflow进阶篇-5(反向传播1)
    Linux后台进程管理以及ctrl+z(挂起)、ctrl+c(中断)、ctrl+(退出)和ctrl+d(EOF)的区别(转)
    mysql基础知识(3)
    mysql基础知识(2)
    tensorflow进阶篇-4(损失函数3)
    tensorflow进阶篇-4(损失函数2)
    mysql基础知识(1)
  • 原文地址:https://www.cnblogs.com/ninali/p/3076063.html
Copyright © 2011-2022 走看看