首页 > 其他 > 详细

说说background那些坑爹的事儿~

时间：2017-08-31 15:47:13      阅读：278      评论：0      收藏：0      [点我收藏+]

啥都不说先上个代码~

.content {
  1.  background: url(../images/bg.png) no-repeat bottom center,-webkit-linear-gradient(#639fff,#4b7aff),linear-gradient(#639fff,#4b7aff);
  2. border-radius: .2rem;
  3. background-size: 8rem auto;
}
看第一个红色部分的属性，我原本想要的是一个渐变的背景色加一个背景图片，结果遍历设备的时候发现安卓4.0的破机子不支持~！！
结果我又默默回去改了，改成下下面那样：
.content {
  1.  background: -webkit-linear-gradient(#639fff,#4b7aff),linear-gradient(#639fff,#4b7aff);
  2.  border-radius: .2rem;
  3.  background-size: 8rem auto;
  4.  background-image: url(../images/bg.png);
}
后来默默的被告知原来渐变也是类似于背景图，所以被覆盖了，两个属性只留下了一个
最后附上最后的写法：
.content {
  1. background-color: #639fff;
  2. border-radius: .2rem;
  3. background-size: 8rem auto;
  4. background-image: url(../images/bg.png);
  5. background-repeat: no-repeat;
  6. background-position: bottom center;
}
把渐变的颜色也给改成了单色。。不然你要是想保留渐变色的话也可以把图片直接写成<img src="../images/bg.png">

说说background那些坑爹的事儿~

原文：http://www.cnblogs.com/wmj1155/p/7458177.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
分享档案
更多>
2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)
最新文章
更多>
教程昨日排行
更多>
友情链接
汇智网   PHP教程   插件网  
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣，分享程序人生！