文档章节

Web 兼容性

木子jd
 木子jd
发布于 2015/12/01 18:18
字数 344
阅读 19
收藏 0

1、透明度:opacity

opacity:.6;

filter:alpha(opacity=70);

-moz-opacity:.6


2、移动端如何清除输入框内阴影
在iOS上,输入框默认有内部阴影,但无法使用 box-shadow 来清除,如果不需要阴影,可以这样关闭:
input,
textarea {
  border: 0;
  -webkit-appearance: none;
}

3、禁止文本缩放
html {
    -webkit-text-size-adjust: 100%;
}

4、audio元素和video元素在ios和andriod中无法自动播放
应对方案:触屏即播
$('html').one('touchstart',function(){
    audio.play()
})


5、手机拍照和上传图片

<input type="file">的accept 属性
<!-- 选择照片 -->
<input type=file accept="image/*">
<!-- 选择视频 -->
<input type=file accept="video/*">

ios 有拍照、录像、选取本地图片功能
部分android只有选取本地图片功能
winphone不支持
input控件默认外观丑陋


6、//单行文本溢出
.xx{
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
}
//多行文本溢出
.xx{
        display:-webkit-box !importmort;
        overflow:hidden;
        text-overflow:ellipsis;
        word-break:break-all;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:2;(数字2表示隐藏两行)
}


7、IE 兼容模式

优先使用最新版本的IE 和 Chrome 内核

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">



8、Display 属性会影响页面的渲染,请合理使用。

  • display: inline后不应该再使用 width、height、margin、padding 以及 float;

  • display: inline-block 后不应该再使用 float;

  • display: block 后不应该再使用 vertical-align;

  • display: table-* 后不应该再使用 margin 或者 float;

9、Button 按钮的点击时候出现蓝色边框

button{ outline:none; }


© 著作权归作者所有

共有 人打赏支持
木子jd
粉丝 1
博文 16
码字总数 7602
作品 0
广州
程序员
IE兼容性之杂项(Quirks)模式

此文转载,记录下遇到的问题,暂时没有仔细考究。 IE=EmulateIE7 标签的作用 对于 Web 开发人员来说,文本兼容性是一个要考虑的重要问题。Windows Internet Explorer 8 引入了文本兼容性模式...

Rella蕾拉
2015/04/08
0
0
mobile web 前端研发流程 【转载】

接触Mobile WEB前端开发将近一年时间了,在这不算短的时间里,通过吸取圆心、沉鱼等前辈们的经验以及不断的摸索和实战,总结出一套自己的Mobile WEB“研发流程”。为什么叫“研发”流程而不是...

石秋风
2012/04/18
0
2
JSP页面兼容性视图浏览失败

各位大佬好, 现在有个web平台,被集成到了另一个CS架构的客户端里面,就是给个无登录链接让用户在客户端点击看到网页,可是遇到个问题:浏览器兼容性视图显示,我们的web平台在浏览器里面只...

什么的什么
2017/11/23
43
1
浏览器兼容性测试应该如何做?

如今,市面上的浏览器种类越来越多(尤其是在平板和移动设备上),这就意味着你所测试的站点需要在这些你声称支持浏览器上都能很好的工作。 同时,主流浏览器(IE,Firefox,Chrome,Opera,Saf...

白一客
2017/06/15
178
1
Internet Explorer 11 Enterprise Mode 详解

白驹过隙,已经三月未能及时更新博文,今天为大家分享有关IE 11 Enterprise Mode(企业模式)两个章节内容,之前看到好多群里讨论有关IE11企业模式的问题,这里简单做一下汇总,第一章为IE11企...

wenzhongxiang
2016/04/19
0
0

没有更多内容

加载失败,请刷新页面

加载更多

OSX | SafariBookmarksSyncAgent意外退出解决方法

1. 启动系统, 按住⌘-R不松手2. 在实用工具(Utilities)下打开终端,输入csrutil disable, 然后回车; 你就看到提示系统完整性保护(SIP: System Integrity Protection)已禁用3. 输入reboot回车...

云迹
今天
4
0
面向对象类之间的关系

面向对象类之间的关系:is-a、has-a、use-a is-a关系也叫继承或泛化,比如大雁和鸟类之间的关系就是继承。 has-a关系称为关联关系,例如企鹅在气候寒冷的地方生活,“企鹅”和“气候”就是关...

gackey
今天
4
0
读书(附电子书)|小狗钱钱之白色的拉布拉多

关注公众号,在公众号中回复“小狗钱钱”可免费获得电子书。 一、背景 之前写了一篇文章 《小狗钱钱》 理财小白应该读的一本书,那时候我才看那本书,现在看了一大半了,发现这本书确实不错,...

tiankonguse
今天
4
0
Permissions 0777 for ‘***’ are too open

异常显示: @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @ WARNING: UNPROTECTED PRIVATE KEY FILE! @ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ ......

李玉长
今天
5
0
区块链10年了,还未落地,它失败了吗?

导读 几乎每个人,甚至是对通证持怀疑态度的人,都对区块链的技术有积极的看法,因为它有可能改变世界。然而,区块链技术问世已经10年了,我们仍然没有真正的用上区块链技术。 几乎每个人,甚...

问题终结者
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部