一些移动端会用到的实战

最新推荐文章于 2023-02-16 11:04:54 发布

weixin_30872733

最新推荐文章于 2023-02-16 11:04:54 发布

阅读量75

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wulibo/p/6905004.html

---恢复内容开始---

移动端

a标签点击变背景蓝色问题  -webkit-tap-highlight-color: #transparent;

　使 i 标签和文字对齐 1：margin-bottom　　2：使用盒子模型box-sizing:border-box 用vertical-align调整（还有一种情况就是 font-size 文字和i图标大小不一致,目前没有找到办法调整,只能设置成一样）

/*清除浮动代码*/
.clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0}
.clearfloat{zoom:1}
八种方法处理CSS浮动问题　http://blog.youkuaiyun.com/u010139093/article/details/28385545

设置高度，2行，超出部分省略号

　　overflow: hidden;
　　text-overflow: ellipsis;
　　display: -webkit-box;
　　-webkit-line-clamp: 2;
　　-webkit-box-orient: vertical;

手机显示又白边（html固定px）

按照比例进行缩放，横向可移动，需在容器body 加一个 overflow:hidden属性

安卓系统呼出键盘遮罩

1 设计上的问题；http://my.oschina.net/cjlice/blog/625526

2 进行判断http://caibaojian.com/browser-ios-or-android.html

　　然后input fouse上浮，click清除错误样式

http://www.w3dev.cn/article/20150617/javascript-check-android-keyboard-show-hide.aspx

我还没测试这个，这篇看起来也不错

清除input的输入内容：看这个顺序；

var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
var mobile = $("#contactMobile").val();

if(!myreg.test(mobile)){
    $("#contactMobile").val("");
    $("#contactMobile").attr({placeholder:"请输入有效的手机号码"});
    $("#contactMobile ").focus();
    $("#contactMobile ").addClass("active");
    return;
 }

颜色转换为 rgba;

http://www.atool.org/colorpicker.php

背景

background: rgba(0,0,0,0.3);

---恢复内容结束---

转载于:https://www.cnblogs.com/wulibo/p/6905004.html