移动端的input不能输入
问题出在:
//禁止用户进行复制.选择.
-webkit-user-select: none;
解决如下:
上述代码会产生一些问题。阻止了用户的选择内容行为,会导致一些“内容可编辑”标签无法正常使用,比如input、testarea。
{
-webkit-user-select: text;
-user-select: text;
}
css3渐变
#box{
width: 600px;
height: 600px;
background: linear-gradient(to right, rgb(229,249,253) , rgb(207,221,255));
}
行内元素不能设置宽高
justify-content: center;指的是主轴上的对齐, 而align-items: center;指的是交叉轴上的对齐
背景图自适应div盒子的宽高
.coupon-list-item{ background:url(../image/coupon.png) no-repeat; background-size:100% 100%; -moz-background-size:100% 100%; }
移动端高清、多屏适配方案 :border: 1px问题
clip-path裁剪图片
clip-path: inset(10px 20px 30px 40px); /* or "none" */ /* 值指的是 top, right, bottom, left 四个点 */
参考资料:CSS中的clip-path裁剪图片用法