<!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. java-常用注解

    JDK自带注解 @Override 重写, 标识覆盖它的父类的方法 @Deprecated   已过期,表示方法是不被建议使用的 @Suppvisewarnings 压制警告,抑制警告 元注解 @Ta ...

  2. 无界面运行Jmeter压测脚本 --后知者

    原文作者---后知者 原文地址:http://www.cnblogs.com/houzhizhe/p/8119735.html [后知者的故事]:针对单一接口压测时出现了从未遇到的问题,设好并发量后用 ...

  3. mysql性能分析show profile/show profiles

    MySQL性能分析show profiles show profile 和 show profiles 语句可以展示当前会话(退出session后,profiling重置为0) 中执行语句的资源使用情 ...

  4. centos中nodejs npm安装cordova

    1.安装cordova npm install -g cordova --registry https://registry.npm.taobao.orgnpm install -g ionic -- ...

  5. js for dwg viewer in B/S

    https://github.com/autodesk-forge/ https://sharecad.org/zh/DWGOnlinePlugin http://3d-viewers.com/lic ...

  6. 自定义Write节点的afterrender属性

    由于nuke中的write节点提供了beforerender,afterrender这类事件,我们想添加一些功能只需要在这里面敲入代码即可.事件一旦发生,自然会触发我们敲入的co de.   Nuke ...

  7. 黄聪：ffmpeg参数说明（转载）

    ffmpeg.exe -i F:\闪客之家\闪客之歌.mp3 -ab 56 -ar 22050 -b 500 -r 15 -s 320x240 f:\11.flv ffmpeg -i F:\01.wm ...

  8. ALGO-39_蓝桥杯_算法训练_数组排序去重

    问题描述 输入10个整数组成的序列,要求对其进行升序排序,并去掉重复元素. 输入格式 10个整数. 输出格式 多行输出,每行一个元素. 样例输入 样例输出 解题思路: 若输入的数字存在数组中,剔除,否 ...

  9. vue2.0变化

    之前有很多的vue知识总结都是围绕1.0版本实现的,下面主要总结一下2.0相对于1.0的一些变化. 组件定义 在vue1.0中,我们有使用vue.extend()来创建组件构造器继而创建组件实例,如下 ...

  10. NIO文件锁FileLock

    目录 <linux文件锁flock> <NIO文件锁FileLock> <java程序怎么在一个电脑上只启动一次,只开一个进程> 文件锁可以是shared(共享锁) ...