box-shadow在ios下没有显示,但是在android机下显示正常。
1、html如下
<textarea class="paScreenTxt" id="paScreenTxt">
2、css如下
.paScreenTxt{
width:98%;
height:200px;
display: block;
margin: 12px auto;
box-shadow: 0px 0px 2px 2px #CCC;
}
3、在android机下文本框有阴影,但是ios下显示效果和android不一样
4、是因为ios下给textarea设置默认边框样式
5、解决方法:加上样式 -webkit-appearance: none; 去掉Ios默认的样式
6、在ios下显示边框阴影,加上样式: -webkit-box-shadow: 0px 0px 2px 2px #CCC; 前面两个0px 0px表示给四条边框加上阴影 2px 2px 表示模糊的阴影半径 颜色#CCC 表示阴影颜色
7、完整的css如下:
.paScreenTxt{
width:98%;
height:200px;
display: block;
margin: 12px auto;
-webkit-appearance: none;
box-shadow: 0px 0px 2px 2px #CCC;
-webkit-box-shadow: 0px 0px 2px 2px #CCC;
}
原文地址:https://blog.csdn.net/tangxiujiang
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。