颜色自己可以调节

如图:

采集器管理下面的那条线就是

css代码:

.linear{
            width:100%;
            height:2px;
            background: linear-gradient(
            to right,
            rgba(0,0,0,0) 0%,
            rgba(0,0,0,0) 10%,
            rgba(35,198,200,0.3) 20%,
            rgba(35,198,200,0.4) 30%,
            rgba(35,198,200,0.5) 40%,
            rgba(35,198,200,0.8) 50%,
            rgba(35,198,200,0.5) 60%,
            rgba(35,198,200,0.4) 70%,
            rgba(35,198,200,0.3) 80%,
            rgba(0,0,0,0) 90%,
            rgba(0,0,0,0) 100%)
        }

css3渐变 两边透明中间高亮的更多相关文章

  1. CSS3渐变(Gradients)-线性渐变

    CSS3渐变(Gradients)可以让你在两个或多个指定颜色之间显示平稳的过度,包括透明度. 以前,你必须使用图像来实现这些效果.但是,通过Css3渐变(Gradients),你可以减少下载的事件和 ...

  2. CSS3渐变——径向渐变

    上节在<再说CSS3渐变——线性渐变>和大家一起学习了CSS3 Gradient中径向渐变最新语法(称得上是W3C的标准语法)相关知识以及其基本使用.今天我们在这一篇中主要和大家一起来了解 ...

  3. CSS3 渐变(Gradients)

    参考: http://www.runoob.com/css3/css3-gradients.html CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡. 以前,你必 ...

  4. CSS3:CSS3 渐变(Gradients)

    ylbtech-CSS3:CSS3 渐变(Gradients) 1.返回顶部 1. CSS3 渐变(Gradients) CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳 ...

  5. css3渐变(Gradients)

    <html> http://www.runoob.com/css3/css3-gradients.html CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的 ...

  6. 25个CSS3 渐变和动画效果教程

    随着最新版CSS3渐变和动画功能发布,Web开发者在开发的过程中有了更多的选择.实际上,已经有了一些替代的技术,目的都是使网站的建设变得简易,高效和快速.不过CSS3所提供的渐变功能有着显著的优点,特 ...

  7. css3 渐变记

    css3 渐变 线性渐变 径向渐变 重复线性渐变 重复径向渐变 线性渐变 线性渐变接受三个参数,渐变的方向,起始颜色,结束颜色. 标准语法及参数:linear-gradient:([[<angl ...

  8. Css3渐变实例Demo(一)

    1.指定渐变背景的大小 .div { background: url(../img/1.jpg); /*background-size:contain;*/ width: 500px; height: ...

  9. Css3渐变(Gradients)-径向渐变

    CSS3径向渐变-radial-gradient()/repeating-radial-gradient() 径向渐变由它的中心定义. 创建径向渐变,至少定义两种颜色节点,呈现平稳过度的颜色.同时,你 ...

随机推荐

  1. javaweb项目静态资源被拦截的解决方法

    <servlet-mapping> <servlet-name>springMvc</servlet-name> <url-pattern>/*< ...

  2. 通过DBMS_REDEFINITION包对表在线重定义

    基础介绍 Oracle Online Redefinition可以保证在数据表进行DDL类型操作,如插入.删除数据列,分区处理的时候,还能够支持DML操作,特别是insert/update/delet ...

  3. Apache+Tomcat+mod_jk配置教程

    0.说明 首先我们要弄明白mod_jk的作用是反向代理,而其实使用httpd.conf中的<VirtualHost>标签就可以实现反向代理,为什么还要多搞个mod_jk那么麻烦做反向代理. ...

  4. WebSphere隐藏版本号教程

    一.实施步骤 1.登陆WAS控制台,进入服务器列表界面. 2.选择一个server进到server配置页面. 3.选择进入“Web容器传输链”页面. 针对这4项都进行以下第4和第5步操作,以下以WCI ...

  5. Java中static的用法,初始化块

    使用 Arrays 类操作 Java 中的数组语法: Arrays.sort(数组名); 可以使用 sort( ) 方法实现对数组的排序,只要将数组名放在 sort( ) 方法的括号中,就可以完成对该 ...

  6. mysql索引类型和方式

    索引 数据库的索引就像一本书的目录,能够加快数据库的查询速度. MYSQL索引有四种PRIMARY.INDEX.UNIQUE.FULLTEXT, 其中PRIMARY.INDEX.UNIQUE是一类,F ...

  7. 逆袭之旅DAY16.东软实训.Oracle.序列

    2018-07-12 14:07:44 序列 序列1.创建序列create sequence 序列名 [increment by n] ---步长 [start with n] ---序列的起始值 序 ...

  8. 对大学生学习Linux系统的七项实用建议

    你现在的工作是你所渴望的理想工作吗?或者说这只是你整个职业生涯中的一段插曲?虽然我们每个人都不一定能够说出自己所想的是什么,但是我们心里其实跟明镜似的.相信许多人对于自己喜好的工作投入精力不会有问题, ...

  9. 根据访问ip的地区跳转到指定地址

    <script type="text/javascript" src="http://ip.ws.126.net/ipquery"></scr ...

  10. Android : 修改内核源码 and 编译、打包成新的boot.img

    一.Android内核源码的下载: 1.Google GIT地址: $ git clone https://android.googlesource.com/kernel/common.git $ g ...