很神奇的背景设置，

看代码，

<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. MVC开发 好的扩展套件(Visual Studio 插件)

     

  2. java集合_collection 中的方法 通过Arraylist来体现

    import java.util.*; /* Collection定义了集合框架的共性功能.1,添加    add(e);    addAll(collection); 2,删除    remove( ...

  3. Generate GUID using vbscript

    在 .msi 中 的 Component table,查看 ComponentId 列,是一个16进制数的字符串, 用 InstallShield IDE 添加一个 component ,Compon ...

  4. slabs.c

    /* -*- Mode: C; tab-width: 4; c-basic-offset: 4; indent-tabs-mode: nil -*- */ /* * Slabs memory allo ...

  5. mysql用户管理,权限管理

    mysql权限 相关操作: 授予的权限分为四组: 列权限:和表中的一个具体列相关,例如:使用update 语句更新test表中name 列的值 表权限:和一个具体的表的所有数据相关,例如:使用 sel ...

  6. 掌握 ActionResult

    我在上一篇博客不要停留在表面,MVC 3 我们要深入一些 说明了我们的掌握程度还是不够,还需要我们继续努力.但是有园友质疑说他们认为我说的只是书院派,并不实用,这令作为程序员的我很是生气.好吧,那咱们 ...

  7. opengl Test

    LIBS += -lGL -lGLU -lglut -lGLEW #include <GL/glut.h> #include <iostream> using namespac ...

  8. 谈谈GUI的配色和字体选择

    对于工控领域的显示屏,显示效果很难和电脑屏幕相比.电脑上操作系统或者各种软件的配色方案,在应用到工业控制屏上就会出现“完全不是所想要”的结果,所以工控领域GUI的色彩.字体的选择还是有特别的讲究. 配 ...

  9. WPF获取控件的句柄

    在WinForm中,获得句柄是一件很容易的事情,This.Handle或者Control.Handle就可以,最近在WPF的开发中发现找不到这个属性,一番查找资料后找到了两种方式. 1,使用Windo ...

  10. 开发软件设计模型 visual studio UML

    http://www.ibm.com/developerworks/cn/rational/rationaledge/content/feb05/bell/ http://msdn.microsoft ...