很神奇的背景设置，

看代码，

<html>

	<title>css</title>

	<style>

		.content {

            background: linear-gradient(90deg,yellow,red);

            width: 100%;

            height: 100%;

		}

	</style>

	<body>

        <div class="content"></div>

	</body>

</html>

会产生这种效果的背景。

查看浏览器支持性，www.caniuse.com

可以看出很多浏览器都支持！

css揭秘之linear-gradient的更多相关文章

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

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

  2. CSS揭秘之多重边框&连续的图像边框

    1.多重边框 我们可以通过使用border-image来写一个多重边框,或使用多个元素来模拟多重边框,不过我们有更好的办法来制作一个多重边框,那就是使用box-shadow的第四个参数(称为扩张半径) ...

  3. css 揭秘-读书笔记

    css 揭秘 [希]Lea verou 著 css 魔法 译 该书涵盖7大主题,47个css技巧,是css进阶必备书籍,开阔思路,探寻更优雅的解决方案.这本书完全用css渲染出的html写成的(布局. ...

  4. [css 揭秘]-css coding tips

    css 揭秘之css coding tips demo(1) html 代码: <body> <section> <div class="demo1" ...

  5. CSS揭秘读书笔记 （一）

    CSS揭秘读书笔记      (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px  solid  hsla(0,0%,100%,.5); background: ...

  6. 《css揭秘》

    <css揭秘> 第一章:引言 引言 案例们 第二章:背景与边框 背景和边框 半透明边框(rgba/hsla.background-clip) 多重边框(box-shadow) 灵活的背景定 ...

  7. [css 揭秘]：CSS揭秘 技巧（三）：背景定位

    我的github地址:https://github.com/FannieGirl/ifannie 源码都在这上面哦! 喜欢的给我一个星吧 背景定位 问题:很多时候,我们想针对容器某个角对背景图片做便宜 ...

  8. CSS揭秘 技巧（五）：条纹背景

    条纹背景 https://github.com/FannieGirl/ifannie/问题:条纹背景 在设觉设计中无处不在,我们真的可以用css 创建图案吗? 这一章相对还是比较复杂的哦!一起get. ...

  9. [css 揭秘]：CSS揭秘 技巧（四）：边框内圆角

    我的github地址:https://github.com/FannieGirl/ifannie/ 源码都在这上面哦! 喜欢的给我一个星吧 边框内圆角 问题:有时候我们需要一个容器,只在内侧有圆角,而 ...

  10. [css 揭秘]：CSS揭秘 技巧（二）：多重边框

    我的github地址:https://github.com/FannieGirl/ifannie/ 源码都在这上面哦! 喜欢的给我一个星吧 多重边框 问题:我们通常希望在css代码层面以更灵活的方式来 ...

随机推荐

  1. POJ 2777(线段树)

    Count Color Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 42507   Accepted: 12856 Des ...

  2. 07_例子讲解：rlCoachKin + rlCoachMdl

    RL提供了2个相当简单的基于socket的虚拟化机器人,是socket服务端. rlCoachKin是用于D-H运动链(在rlkin\*xml中定义的). rlCoachMdl相当于任意几何的工具链. ...

  3. POJ 1050 To the Max -- 动态规划

    题目地址:http://poj.org/problem?id=1050 Description Given a two-dimensional array of positive and negati ...

  4. 通过bat命令批量删除VS查找历史记录

    有时候我们会发现我们的VS查找下拉框里面有很多之前的搜索记录,想删除但是却没有地方删除.  网上的方法都是直接找到注册表HKEY_CURRENT_USER\Software\Microsoft\Vis ...

  5. 面试题(C#算法编程题)

    1>用C#写一段选择排序算法,要求用自己的编程风格.答:private int min;    public void xuanZhe(int[] list)//选择排序    {        ...

  6. windows8.1专业中文版一个可用的密钥分享

    分享一个windows8.1专业中文版一个可用的密钥,亲测可用,联网输入密钥激活即可. PKHMN-TWQ6R-XDTH7-P4WW4-YR9T7

  7. BeeFramework

    A semi-hybrid framework that allows you to create mobile apps using Objective-C and XML/CSS

  8. DB天气app冲刺第七天

    今天估计得分应该是最差的了. 今天因为完全没准备所以在界面UI上面根本就是相当于没弄.结果今天的各组报告里自己做得很不好.不过好在只是项目的中间期,不碍大事. 今天也完成了任务.可以说超额了也.因为吃 ...

  9. Nhibernate cookbook 3.0-翻译

    /* Style Definitions */ table.MsoNormalTable {mso-style-name:普通表格; mso-tstyle-rowband-size:0; mso-ts ...

  10. uva 165 Stamps

    题意: 现有k种邮票面额, 一封信上最多贴h张邮票. 求能贴出的最大连续区间,即[1, max_value]这个区间内的所有面额都能贴出来. 并输出k种面额, h + k <= 9. 思路: 这 ...