用bootstrap轮播图:Carousel插件,图片两侧影音实在碍眼,想去掉,首先发现有css里由opacity: 0.5这个东西来控制,全部改成opacity: 0.0,发现指示箭头也看不见了。

然后各种搜索,发现原来是应该这么改:

.carousel-control.left {
/*background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);*/
background-image:none;
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}
.carousel-control.right {
left: auto;
right:;
/*background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);*/
background-image:none;
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
}

绿色是原来的css,被注释掉了,加一条

  background-image:none;

再看看,问题是不是已经完美解决了

bootstrap轮播图 两侧半透明阴影的更多相关文章

  1. Bootstrap 轮播图的使用和理解

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

  2. bootstrap轮播图--兼容IE7

    <!DOCTYPE html> <html> <head> <title>Bootstrap轮播</title> <meta char ...

  3. 动态请求数据并放入bootstrap轮播图

    下面是前端代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  4. 第124天:移动web端-Bootstrap轮播图插件使用

    Bootstrap JS插件使用 > 对于Bootstrap的JS插件,我们只需要将文档实例中的代码粘到我们自己的代码中> 然后作出相应的样式调整 Bootstrap中轮播图插件叫作Car ...

  5. bootstrap轮播图组件

    一.轮播图组件模板(官方文档) <div id="carousel-example-generic" class="carousel slide" dat ...

  6. bootstrap轮播图

    <!doctype html><html><head> <meta charset="utf-8"> <title>使用 ...

  7. Bootstrap 轮播图(Carousel)插件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. bootstrap轮播图不能显示左右箭头

    引入font文件夹即可 原文 :http://www.imooc.com/qadetail/64277

  9. Bootstrap 我的学习记录4 轮播图的使用和理解

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

随机推荐

  1. H5 俄罗斯方块Demo

    链接:http://pan.baidu.com/s/1hrDM0T2

  2. Codeforces Round #498 (Div. 3)--E. Military Problem

    题意问,这个点的然后求子树的第i个节点. 这道题是个非常明显的DFS序: 我们只需要记录DFS的入DFS的时间,以及出DFS的时间,也就是DFS序, 然后判断第i个子树是否在这个节点的时间段之间. 最 ...

  3. xcode8 使用Instruments检测定位并解决iOS内存泄露

    https://www.jianshu.com/p/9bc7e65fc247 2017.07.27 17:24* 字数 628 阅读 1319评论 6喜欢 21 简介: 虽然苹果出了ARC(自动内存管 ...

  4. PHP之提升代码质量36计

    转载:https://www.binarytides.com/35-techniques-to-enhance-your-php-code/ 1.不要使用相对路径 常常会看到: require_onc ...

  5. SELECT list is not in GROUP BY clause and contains nonaggregated column

    报错如下: Expression # of SELECT list is not in GROUP BY clause and contains nonaggregated column ‘sss.m ...

  6. Datatable get请求传参应用

    以关注页面为例: html: <div class="row"> <div class="col-md-12 col-sm-12 col-xs-12&q ...

  7. codeforces483B

    Friends and Presents CodeForces - 483B You have two friends. You want to present each of them severa ...

  8. eclipse报错 : One or more constraints have not been satisfied.

    当eclipse进行报错时,但是不影响运行时,这种错误一般是编译时的问题 进行修改3个地方,即可完成 一 :  进行修改这三个地方的配置文件,都改成你统一的jdk版本,和你用的Dynamic Web ...

  9. Windows 7 下安装 docker 应用容器引擎

    文档地址 ====================================== 安装篇 下载工具 https://get.daocloud.io/toolbox/ 下载完成点击安装 (可参考: ...

  10. pytest 12 函数传参和fixture传参数request

    前沿: 有的case,需要依赖于某些特定的case才可以执行,比如,登陆获取到的cookie,每次都需要带着他,为了确保是同一个用户,必须带着和登陆获取到的同一个cookies. 大部分的用例都会先登 ...