APICloud无疑已是相当火的APP开发工具了,面对从web到移动APP转变的开发者可能有很多小常识并不是特别熟悉,比如这个border。怎样让1px更细,看起来像原生的?下面教大家一个方法:- .border {
- position: relative;
- width: 300px;
- height: 200px;
- }
- .border:after {
- border: 1px solid #ff3300;
- display: block;
- content: '';
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- -webkit-transform-origin: 0 0;
- -webkit-transform: scale(1);
- pointer-events: none;
- }
- @media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
- .border:after {
- right: -100%;
- bottom: -100%;
- -webkit-transform: scale(0.5);
- }
- }
复制代码 如果是想要上边框或者下边框。。。那么只需要修改border:after里面的border就可以了。
PS:特别说明千万别漏下了pointer-events: none;要不然就没法点击了
|