jquery主页第一眼看到的就是这个玻璃渣效果,设计者利用高光和阴影制造出这种效果。

怎么做出这种感觉呢?

第一步:导航区设定为半透明,颜色为rgba(0,0,0,.1)

第二步:左上角和右上角切出圆角(not important)

第三步:导航区上部起高亮border-top: 1px solid rgba(255,255,255,.3)

第三步:导航区四边起阴影box-shadow:0 0 5px rgba(0,0,0,.7)

第四布:增加左侧导航区阴影效果border-left: 1px solid rgba(0,0,0,.3)

好的歌唱也唱不厌,jquery主页许多地方有类似的手法,不信请往下看:

okokokokkokoko

 

看不见。。。。好吧,我也是买了一个放大镜才看到的,效果的样子类似于:用刀在灰色的岩石上画了一条线,就像..就像古碑上刻的字。 所做的设置很简单,根据背景的颜色选取高光和阴影的颜色;颜色确定后,开始设置阴影:box-shadow: 0 -1px #000;设置高光:border-top: 1px solid #333

嗯,写到这了,以后继续补充---------------------------the world ain't all sunshine and rainbows

美丽的阴影(剖析jquery主页)的更多相关文章

  1. 通过案例来剖析JQuery与原生JS

    首先来个例子: 我们在登陆或者注册一些网站时,如果某一项点过了但没填,鼠标移走后是不是经常看到网站有相应的红色字体提示呢? 那下面我们就以这个为例来剖析下jQuery和原生JS的一些区别,来上代码: ...

  2. box-shadow 阴影剖析

    box-shadow的四个值分别是左右偏移,上下偏移,向四周模糊扩算,距离四周边缘的距离,最后一个是阴影的颜色值,如图示例: 上代码,复制代码,就可以看到上图的效果 <!DOCTYPE html ...

  3. jQuery源码分析系列

    声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://git ...

  4. jQuery源码分析-01总体架构

    1. 总体架构 1.1自调用匿名函数 self-invoking anonymous function 打开jQuery源码,首先你会看到这样的代码结构: (function( window, und ...

  5. jquery 源码学习(一)

    从上边的注释看,jQuery的源码结构相当清晰.条理,不像代码那般晦涩和让人纠结   1. 总体架构 1.1 自调用匿名函数 self-invoking anonymous function 打开jQ ...

  6. jQuery 实验教程

    jQuery 实验教程 jQuery 简介.语法及事件处理 jQuery 以其特有的简练的代码风格,极大得改变了 JavaScript 代码编写的方式.本教程以实例代码为基础,讲解 jQuery 的使 ...

  7. jQuery概述,代码举例及最新版下载

    jQuery是一个快速的,小巧的,具有强大功能的JavaScript库. 它的基本功能包括: 1)访问和操作DOM元素 2)控制页面样式(可以兼容各种浏览器) 3)对页面事件的处理 4)大量插件在页面 ...

  8. [转]jQuery源码分析系列

    文章转自:jQuery源码分析系列-Aaron 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://github.com/JsAaro ...

  9. jQuery 顶部导航尾随滚动,固定浮动在顶部

    jQuery 顶部导航尾随滚动.固定浮动在顶部 演示 XML/HTML Code <section> <article class="left"> < ...

随机推荐

  1. 图文详解远程部署ASP.NET MVC 5项目

    话外篇: 由于感觉自己的机器比较慢,配置不好,所以最近想把之前的项目部署到实验室的服务器上,但是由于常不在实验室,所以在想能不能远程部署.因此今天专门研究了一下具体的过程,下面和大家分享一下.本人新手 ...

  2. Mysql 导入数据,推荐Source命令,太快了

    http://jingyan.baidu.com/article/cbf0e500d15c762eab289362.html

  3. mysql 索引- 笔记

    索引 mysql最常用的索引结构是btree(O(log(n))),但是总有一些情况下我们为了更好的性能希望能使用别的类型的索引.hash就是其中一种选择,例如我们在通过用户名检索用户id的时候,他们 ...

  4. linux 系统运维

    Linux 系统监控1.进程    查看所有进程     ps -ef     ps -ef |grep nginx 结束进程    # 结束进程号为5031    kill -g 5031 # 结束 ...

  5. C#通过RFC调用SAP

    using System;using System.Collections.Generic;using SAP.Middleware.Connector;using System.Data;using ...

  6. IoC控制反转与DI依赖注入

    IoC控制反转与DI依赖注入 IoC: Inversion of Control IoC是一种模式.目的是达到程序的复用.下面的两篇论文是对IoC的权威解释: InversionOfControl h ...

  7. 金蝶EAS常用表

    select * from T_SCM_BillType where FName_L2 like '%委外%'   --单据类型表,查业务单据对应的表  102--销售出库单  330--应收单 se ...

  8. php中关于js保存文件至本地的问题

    最近在搞一个livezilla的在线客服聊天的东东,客户界面要求添加一个下载聊天记录的功能.于是我就是翻看了下网上的各种关于”js保存文件至本地“的资料,发现只能在IE下通过execCommand实现 ...

  9. codeforce A. Design Tutorial: Learn from Math

    题意:将一个数拆成两个合数的和, 输出这两个数!(这道题做的真是TMD水啊)开始的时候不知道composite numbers是啥意思,看了3遍才看懂.... 看懂之后又想用素数筛选法来做,后来决定单 ...

  10. GitHub上那些值得一试的JAVA开源库

    作为一名程序员,你几乎每天都会使用到GitHub上的那些著名Java第三方库,比如Apache Commons,Spring,Hibernate等等.除了这些,你可能还会fork或Star一些其他的开 ...