/*从元素顶部有条阴影，两种方式，第二种更好，能控制阴影的宽度*/
background-image: linear-gradient(0deg, rgba(226, 226, 226, 0) 97%, rgba(0, 0, 0, 0.04) 100%);
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.04) 0px, rgba(226, 226, 226, 0) 12px);
用角度值指定渐变的方向（或角度）。
设置渐变为从右到左。相当于: 270deg
设置渐变从左到右。相当于: 90deg
设置渐变从下到上。相当于: 0deg
设置渐变从上到下。相当于: 180deg。这是默认值，等同于留空不写。

背景上实现阴影——linear-gradient的更多相关文章

  1. CSS实现背景透明而背景上的文字不透明完美解决

    在我们设计制作一些网页的时候可能会用到半透明的效果,首先我们可能会想到用PNG图片处理,当然这是一个不错的办法,唯一的兼容性问题就是ie6 下的BUG,但这也不困难,加上一段js处理就行了.但假如我们 ...

  2. CSS实现背景透明而背景上的文字不透明

    在我们设计制作一些网页的时候可能会用到半透明的效果,首先我们可能会想到用PNG图片处理,当然这是一个不错的办法,唯一的兼容性问题就是ie6 下的BUG,但这也不困难,加上一段js处理就行了.但假如我们 ...

  3. FCC---Create a Gradual CSS Linear Gradient

    Applied Visual Design: Create a Gradual CSS Linear Gradient background: linear-gradient(gradient_dir ...

  4. 第 17 章 CSS 边框与背景[上]

    学习要点: 1.声明边框 2.边框样式 3.圆角边框 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 边框和背景,通过边框和背景的样式设置,给元素增加更丰富的外观. 一．声明边框 边框的声明有 ...

  5. CSS实现背景透明而背景上的文字图片不透明

    1.用图片则能兼容IE8和IE7 2.用颜色则不能兼容IE8和IE7,并且颜色层不能随着内容层自增长,只能设置一个固定高度 3.用颜色则颜色层不能包含内容层(图片和文字) <!-- wrap最外 ...

  6. css实现背景模糊，但不影响背景上的内容

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

  7. 在XIB 或者 SB 上面 实现 半透明的背景上添加UILabel是文字不透明

    设透明背景的时候直接设置RGB值  然后设置Opacity即可

  8. [Canvas]用透明PNG图在背景上画前景能不遮挡背景

    欲看动态效果请点击下载并用Chrome/Firefox浏览器打开index,html. 图例: 从效果可以明显的看到,五角星边缘和中心都没有对背景遮挡. 代码: <!DOCTYPE html&g ...

  9. [MFC]SDI在图片背景上实现文本跟随鼠标移动

    SDI是单文档接口应用程序的简称.本文要实现的是在视图区域显示一张图片,然后在图片表层显示文字,并且文字跟随鼠标移动.思考一下,可以判断这个问题一共分为以下几个部分:1.显示图片:2.找到鼠标的位置: ...

随机推荐

  1. Oracle中用序列和触发器实现ID自增

    在设计数据库的时候,Oracle中没有类似SQL Server中系统自动分配ID作为主键的功能,这时Oracle可以通过“序列”和“触发器”来实现ID自动增加的功能. 1.创建序列Sequence c ...

  2. linux的常用命令介绍

    1.ls  列出当前目录下的所有的文件和文件夹的名称. 参数如下:-a 显示隐藏文件 -l 显示方式为列表 -h 以可读性高的方式输出 eg: ls -lh /logs/tran  目录如果不指定(相 ...

  3. 元数据Metadata

    元数据是什么? 元数据(Metadata),又称中介数据.中继数据,为描述数据的数据(data about data),主要是描述数据属性(property)的信息,用来支持如指示存储位置.历史数据. ...

  4. 一脸懵逼学习Storm---（一个开源的分布式实时计算系统）

    Storm的官方网址:http://storm.apache.org/index.html 1:什么是Storm? Storm是一个开源的分布式实时计算系统,可以简单.可靠的处理大量的数据流.被称作“ ...

  5. SIM 800C指令笔记

    拨号ATD137xxxxxxxx; 挂断-对方挂断收到NO CARRIER消息 挂断-主动挂断ATH 接电话ATA 打入电话消息RING 设置来电电话号码显示AT+CLIP=1显示消息格式:+CLIP ...

  6. day06（深浅拷贝，元组，字典，集合）

    1,今日内容: 1.深浅拷贝:**** 2.元组 - 元组可以存放可变类型 *** 3.字典:***** -- 增删改查 -- 常用方法 4.集合:** -- 集合运算 5.数据类型的相互转化 *** ...

  7. 2019-04-10 集成JasperReport

    1. 报表的制作过程为 ① 制作.jrxml报表模板文件,并编译成.jasper ② 代码处理.jasper文件并填充数据进行输出 2. 一开始是打算使用iReport作为模板制作工具的,但是有以下局 ...

  8. Linux学习之路1

    root用户 安装初始系统默认没有启动root用户,如下方式启动: l  sudo passwd l  连续输入两次密码,启动root用户 l  再登陆 登陆root用户 l  su root l  ...

  9. ASP.NET Core 2.x On Ubuntu

    安装.NET Core 首先需要安装.NET Core Runtime: https://www.microsoft.com/net/download 点击之后,根据您的Linux发行版不同,选择相应 ...

  10. HTML&CSS_基础01

    一.预备知识: # 1. HTML5 是 W3C 与 WHATWG 合作的结果.    W3C 指 World Wide Web Consortium,万维网联盟.    WHATWG 指 Web H ...