<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <title>hi013z左右方向渐变</title>

  <style>

    .gradient {

      height: 200px;

      width: 100px;

      background: -webkit-linear-gradient(left, #FF8C69, #FFE7BA, #FFF8DC); /* Safari 5.1 - 6.0 */

      background: -o-linear-gradient(right, #FF8C69, #FFE7BA, #FFF8DC); /* Opera 11.1 - 12.0 */

      background: -moz-linear-gradient(right, #FF8C69, #FFE7BA, #FFF8DC); /* Firefox 3.6 - 15 */

      background: linear-gradient(to right, #FF8C69, #FFE7BA, #FFF8DC); /* 标准的语法（必须放在最后） */

      height: 2px;

    }

    #body {

      background: black;

    }

  </style>

</head>

<body id="body">

<div class="gradient"></div>

</body>

</html>

js样式之渐变线的更多相关文章

  1. 搜索框js样式（通用型）

    HTML部分代码: -------------------------------------------------------------- <div class="search_ ...

  2. js中动态载入css js样式

    js中动态载入css样式,方法如下: //<link rel="stylesheet" type="text/css" href="http:/ ...

  3. vue.js样式绑定

    vue.js样式绑定 class 与 style 是 HTML 元素的属性,用于设置元素的样式,我们可以用 v-bind 来设置样式属性. Vue.js v-bind 在处理 class 和 styl ...

  4. CSS渐变中是如何定义渐变线的

    在CSS语法中用户代理对渐变gradient语法的解析渲染离不开渐变线.渐变分为线性渐变(linear gradient)和径向渐变(radial gradient). 渐变在元素盒模型中backgr ...

  5. 10.Vue.js 样式绑定

    Vue.js 样式绑定 Vue.js class class 与 style 是 HTML 元素的属性,用于设置元素的样式,我们可以用 v-bind 来设置样式属性. Vue.js v-bind 在处 ...

  6. CSS和Js样式属性的对照关系

    注意:1.在使用js时,如newTD.style.paddingLeft="200";(错误),正确生效的写法是newTD.style.paddingLeft="200p ...

  7. 第十八课：js样式操作需要注意的问题

    样式分为,外部样式(<link />),内部样式(<style></style>),行内样式(style:).再加上一个important对选择器权重的干扰. 大体 ...

  8. React.js 样式组件：React Style

    点这里 React Style 是 React.js 可维护的样式组件.使用 React Native StyleSheet.create一样的样式. 完全使用 JavaScript 定义样式: ? ...

  9. JS 样式操作学习总结。

    在我们编写网页的时候,样式表示我们常常需要相伴的内容,谁然很招人烦.恕我前端菜鸟对这东西很是无力啊.下面是我在代码浪潮中的虚席到的一些东西. 1.样式表内容修改方式. 2.当前元素样式内容获取. 3. ...

随机推荐

  1. html 简单的table样式

    效果预览: 代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  2. JS IE 打开本地exe程序

    例: try{ //新建一个ActiveXObject对象 var exe = new ActiveXObject("wscript.shell"); var exePath = ...

  3. xshell 5中文破解版下载

    xshell 5破解版是一款功能强大的终端模拟软件,支持Telnet.Rlogin.SSH.SFTP.Serial等远程协议,让用户能通过互联网直接连接远程主机.用户通过xshell 5破解版能轻松和 ...

  4. 使用copydata实现进程之间数据传递

    Winform to Winfrom==> 发送端==> using System; using System.Runtime.InteropServices; namespace Cop ...

  5. 下载goland解压错误

    把连接里面的 download.jetbrains.8686c.com 换成 download-cf.jetbrains.com

  6. JS和AS交互

    这个话题在网上应该说很好找,有很多这方面的资料.比者也看过一些,不过大部分都是AS2与JS进行交互.很少提到AS3,即使有,也让人感觉浅尝辄止.很多东西并没有介绍的太清楚.所有笔者萌生了写这样一篇教程 ...

  7. 【springBoot】之定制Banner

    springboot启动时控制台打印图案如下: 1.假如我们不想看到这个图案 public static void main(String[] args) { SpringApplication ap ...

  8. 【剑指offer】逆序输出链表

    输入一个链表,按链表值从尾到头的顺序返回一个ArrayList. *考察栈的使用 *使用循环输出Stack中内容的时候,不能使用for(int i; i<stack.size();i++)因为s ...

  9. Hadoop概念学习系列之Hadoop新手学习指导之入门需知（二十）

    不多说,直接上干货! 零基础学习hadoop,没有想象的那么困难,也没有想象的那么容易.从一开始什么都不懂,到能够搭建集群,开发.整个过程,只要有Linux基础,虚拟机化和java基础,其实hadoo ...

  10. ObjectId与DateTime的互相转换

    s会用mongdb中经常会需要用到通过“_id”去检查数据,筛选数据,但是想根据具体时间的id每次都需要做一下转换,这样搜索起来就很简单了. ObjectId转DateTime /// <sum ...