/*从元素顶部有条阴影,两种方式,第二种更好,能控制阴影的宽度*/
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. HelloHibernate的创建过程

    文章提纲 安装与配置 开发小结 建立项目 配置项目 创建代码 执行项目 安装与配置 JDK的安装:建议使用JRE 1.8以上: SQL Server 2000的安装:建议SQL Server 2000 ...

  2. [十二省联考2019]D1T1异或粽子

    嘟嘟嘟 做这题之前,强烈推荐先把这道题切了P1631序列合并. 这两道题思路基本一模一样. 首先把异或处理成前缀异或,然后维护一个大根堆,每一次取出堆顶加到答案里面,然后把堆顶所在元素的次大的异或值放 ...

  3. 多种解法解决n皇后问题

    多种解法解决n皇后问题 0x1 目的 ​ 深入掌握栈应用的算法和设计 0x2 内容 ​ 编写一个程序exp3-8.cpp求解n皇后问题. 0x3 问题描述 即在n×n的方格棋盘上,放置n个皇后,要求每 ...

  4. 三种方法实现调用Restful接口

    1.基本介绍 Restful接口的调用,前端一般使用ajax调用,后端可以使用的方法比较多, 本次介绍三种: 1.HttpURLConnection实现 2.HttpClient实现 3.Spring ...

  5. completable 用法

    CompletableFuture 前面我们使用过jdk5 提出future的用法,但是在获取结果上并不是那么友好 在Java8中,CompletableFuture提供了非常强大的Future的扩展 ...

  6. CSV的简单用法

    读文件 import csv with open('test.csv','rb') as myFile: lines=csv.reader(myFile) for line in lines: pri ...

  7. C#创建安装、卸载部署程序

    分享3: 需求:对已经开发的应用程序进行安装封装操作,即创建安装.卸载部署程序: 分析:程序的开发是为了在不同的人在不同的机器上使用,为了使不同机器使用该软件就需要见程序安装包,并且保证安装包中必须包 ...

  8. [C++项目]2048控制台游戏

    #include <iostream> #include <windows.h> #include <ctime> using namespace std; ; ; ...

  9. LeetCode21—合并两个有序链表

    方法一:这是我一开始的想法,将链表L2的各个元素与链表L1的元素进行逐一比较,将L2中的数据元素插入L1中的合适位置. 时间复杂度:O(m+n):空间复杂度:O(1) 1)首先,可能要对第一个元素进行 ...

  10. Keil MDK5的ITM调试

    https://blog.csdn.net/burgesskzg/article/details/77100453