以下是 jQuery HTML5随机密码生成器代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>jQuery HTML5随机密码生成器 </title>
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery2-1-1.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript" src="js/mousehold.js"></script>
</head>
<body>
<div id="container">
<section id="content">
<article id="pswcampbox">
<div id="pswcamp">
<span contenteditable="false">密码</span>
<div id="generate">确定</div>
</div>
</article>
<article id="options">
<div class="option" desc="填写数字" id="number">
<div class="less">-</div>
<div class="value" contenteditable="true" id="numDigits">8</div>
<div class="more">+</div>
</div>
<div class="option" id="upperCase" desc="大写字母"><span>A</span></div>
<div class="option active" id="lowerCase" desc="小写字母"><span>a</span></div>
<div class="option active" id="numbers" desc="数字"><span>3</span></div>
<div class="option active" id="symbols" desc="符号"><span>@</span><span id="symbolOptions">v</span></div>
<div class="option" id="similarChars" desc="避免类似的字符 (1, l, i, 0, o..)"><span>o0</span></div>
</article>
<aside>
<div id="symbolsSelectorContainer">
<div id="symbolsSelector">
<div id="maxSymbolsNumberBox">
<div id="maxSymbolsNumber">
<span class="resta">-</span>
<span class="maxSymbolValue" contenteditable="true">2</span>
<span class="suma">+</span>
</div>
<span>Max. number of symbols:</span>
</div>
</div>
</div>
</aside>
</section>
<aside>
<p id="option-desc"></p>
</aside>
</div>
<script type="text/javascript">
var wh = $(window).height();
var ch = $(".content").height();
$(".content").css("margin-top", (wh-ch)/2);
</script>
</body>
</html>
JS代码(script.js):
var _0x208b=["\x74\x65\x78\x74","\x23\x6E\x75\x6D\x44\x69\x67\x69\x74\x73","\x6D\x6F\x75\x73\x65\x68\x6F\x6C\x64","\x2E\x6C\x65\x73\x73","\x2E\x6D\x6F\x72\x65","\x77\x68\x69\x63\x68","\x6B\x65\x79\x64\x6F\x77\x6E","\x2E\x76\x61\x6C\x75\x65","\x62\x6C\x75\x72","\x61\x63\x74\x69\x76\x65","\x74\x6F\x67\x67\x6C\x65\x43\x6C\x61\x73\x73","\x63\x6C\x69\x63\x6B","\x2E\x6F\x70\x74\x69\x6F\x6E","\x68\x61\x73\x43\x6C\x61\x73\x73","\x23\x75\x70\x70\x65\x72\x43\x61\x73\x65","\x23\x6C\x6F\x77\x65\x72\x43\x61\x73\x65","\x23\x6E\x75\x6D\x62\x65\x72\x73","\x23\x73\x79\x6D\x62\x6F\x6C\x73","\x23\x73\x69\x6D\x69\x6C\x61\x72\x43\x68\x61\x72\x73","\x63\x68\x65\x63\x6B\x65\x64","\x23\x72\x65\x70\x65\x61\x74\x53\x79\x6D\x62\x6F\x6C\x73\x20\x23\x63\x68\x65\x63\x6B\x42\x6F\x78\x20\x64\x69\x76","\x73\x74\x6F\x70\x50\x72\x6F\x70\x61\x67\x61\x74\x69\x6F\x6E","\x66\x61\x73\x74","\x73\x6C\x69\x64\x65\x54\x6F\x67\x67\x6C\x65","\x23\x73\x79\x6D\x62\x6F\x6C\x73\x53\x65\x6C\x65\x63\x74\x6F\x72\x43\x6F\x6E\x74\x61\x69\x6E\x65\x72","\x2E\x6F\x70\x74\x69\x6F\x6E\x20\x23\x73\x79\x6D\x62\x6F\x6C\x4F\x70\x74\x69\x6F\x6E\x73","\x66\x72\x6F\x6D\x43\x68\x61\x72\x43\x6F\x64\x65","\x73\x70\x6C\x69\x63\x65","\x73\x65\x6C\x65\x63\x74\x65\x64","\x23\x73\x79\x6D\x62\x6F\x6C\x73\x53\x65\x6C\x65\x63\x74\x6F\x72","\x61\x70\x70\x65\x6E\x64\x54\x6F","\x3C\x73\x70\x61\x6E\x20\x69\x64\x3D\x27\x73\x79\x6D\x62\x6F\x6C\x42\x6F\x78\x27\x3E","\x3C\x2F\x73\x70\x61\x6E\x3E","\x3C\x64\x69\x76\x20\x69\x64\x3D\x27\x72\x65\x70\x65\x61\x74\x53\x79\x6D\x62\x6F\x6C\x73\x42\x6F\x78\x27\x3E\x3C\x64\x69\x76\x20\x69\x64\x3D\x27\x72\x65\x70\x65\x61\x74\x53\x79\x6D\x62\x6F\x6C\x73\x27\x3E\x3C\x73\x70\x61\x6E\x3E\x41\x6C\x6C\x6F\x77\x20\x72\x65\x2D\x75\x73\x69\x6E\x67\x20\x73\x79\x6D\x62\x6F\x6C\x73\x3A\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x64\x69\x76\x20\x69\x64\x3D\x27\x63\x68\x65\x63\x6B\x42\x6F\x78\x27\x3E\x3C\x64\x69\x76\x3E\x3C\x2F\x64\x69\x76\x3E\x3C\x2F\x64\x69\x76\x3E\x3C\x2F\x64\x69\x76\x3E\x3C\x2F\x64\x69\x76\x3E","\x3F","\x23","\x2E","\x3D","\x40","\x21","\x24","\x25","\x5F","\x2A","\x61\x64\x64\x43\x6C\x61\x73\x73","\x65\x61\x63\x68","\x23\x73\x79\x6D\x62\x6F\x6C\x42\x6F\x78","\x63\x68\x69\x6C\x64\x72\x65\x6E","\x2E\x6D\x61\x78\x53\x79\x6D\x62\x6F\x6C\x56\x61\x6C\x75\x65","\x2E\x72\x65\x73\x74\x61","\x2E\x73\x75\x6D\x61","\x23\x63\x68\x65\x63\x6B\x42\x6F\x78\x20\x64\x69\x76","","\x70\x75\x73\x68","\x72\x61\x6E\x64\x6F\x6D","\x66\x6C\x6F\x6F\x72","\x6C\x65\x6E\x67\x74\x68","\x6C","\x6F","\x69","\x4C","\x4F","\x49","\x30","\x31","\x69\x6E\x41\x72\x72\x61\x79","\x50\x6C\x65\x61\x73\x65\x2C\x20\x73\x65\x6C\x65\x63\x74\x20\x73\x6F\x6D\x65\x20\x6F\x70\x74\x69\x6F\x6E\x73\x2E\x0A\x59\x6F\x75\x72\x20\x70\x61\x73\x73\x77\x6F\x72\x64\x20\x63\x61\x6E\x27\x74\x20\x62\x65\x20\x6D\x61\x64\x65\x20\x75\x70\x20\x6F\x66\x20\x6E\x6F\x74\x68\x69\x6E\x67\x21","\x23\x70\x73\x77\x63\x61\x6D\x70\x20\x73\x70\x61\x6E","\x23\x67\x65\x6E\x65\x72\x61\x74\x65","\x64\x65\x73\x63","\x61\x74\x74\x72","\x23\x6F\x70\x74\x69\x6F\x6E\x2D\x64\x65\x73\x63","\x68\x6F\x76\x65\x72","\x72\x65\x61\x64\x79"];
$(document)[_0x208b[73]](function(){
var _0x53a1x1=18;
var _0x53a1x2=3;
$(_0x208b[3])[_0x208b[2]](150,function(){
var _0x53a1x3=parseInt($(_0x208b[1])[_0x208b[0]]());
if(_0x53a1x3>_0x53a1x2){
_0x53a1x3--;
$(_0x208b[1])[_0x208b[0]](_0x53a1x3);
}
;
}
);
$(_0x208b[4])[_0x208b[2]](150,function(){
var _0x53a1x3=parseInt($(_0x208b[1])[_0x208b[0]]());
if(_0x53a1x3<_0x53a1x1){
_0x53a1x3++;
$(_0x208b[1])[_0x208b[0]](_0x53a1x3);
}
;
}
);
$(_0x208b[7])[_0x208b[6]](function(_0x53a1x4){
if(_0x53a1x4[_0x208b[5]]==38){
var _0x53a1x3=parseInt($(_0x208b[1])[_0x208b[0]]());
if(_0x53a1x3<_0x53a1x1){
_0x53a1x3++;
$(_0x208b[1])[_0x208b[0]](_0x53a1x3);
}
;
}
;
if(_0x53a1x4[_0x208b[5]]==40){
var _0x53a1x3=parseInt($(_0x208b[1])[_0x208b[0]]());
if(_0x53a1x3>_0x53a1x2){
_0x53a1x3--;
$(_0x208b[1])[_0x208b[0]](_0x53a1x3);
}
;
}
;
}
);
$(_0x208b[7])[_0x208b[8]](function(){
var _0x53a1x3=parseInt($(_0x208b[1])[_0x208b[0]]());
if(_0x53a1x3>_0x53a1x1){
_0x53a1x3=_0x53a1x1;
$(_0x208b[1])[_0x208b[0]](_0x53a1x3);
}
else{
if(_0x53a1x3<_0x53a1x2){
_0x53a1x3=_0x53a1x2;
$(_0x208b[1])[_0x208b[0]](_0x53a1x3);
}
}
;
}
);
$(_0x208b[12])[_0x208b[11]](function(){
$(this)[_0x208b[10]](_0x208b[9])}
);
var _0x53a1x5;
var _0x53a1x6;
var _0x53a1x7;
var _0x53a1x8;
var _0x53a1x9;
var _0x53a1xa;
function _0x53a1xb(){
if($(_0x208b[14])[_0x208b[13]](_0x208b[9])){
_0x53a1x5=true}
else{
_0x53a1x5=false}
;
if($(_0x208b[15])[_0x208b[13]](_0x208b[9])){
_0x53a1x6=true}
else{
_0x53a1x6=false}
;
if($(_0x208b[16])[_0x208b[13]](_0x208b[9])){
_0x53a1x7=true}
else{
_0x53a1x7=false}
;
if($(_0x208b[17])[_0x208b[13]](_0x208b[9])){
_0x53a1x8=true}
else{
_0x53a1x8=false}
;
if($(_0x208b[18])[_0x208b[13]](_0x208b[9])){
_0x53a1x9=true}
else{
_0x53a1x9=false}
;
if($(_0x208b[20])[_0x208b[13]](_0x208b[19])){
_0x53a1xa=true}
else{
_0x53a1xa=false}
;
}
$(_0x208b[25])[_0x208b[11]](function(_0x53a1x4){
_0x53a1x4[_0x208b[21]]();
$(_0x208b[24])[_0x208b[23]](_0x208b[22]);
}
);
var _0x53a1xc= new Array();
for(var _0x53a1xd=0;
_0x53a1xd<15;
_0x53a1xd++){
_0x53a1xc[_0x53a1xd]=String[_0x208b[26]](_0x53a1xd+33)}
;
for(var _0x53a1xd=15;
_0x53a1xd<22;
_0x53a1xd++){
_0x53a1xc[_0x53a1xd]=String[_0x208b[26]](_0x53a1xd+43)}
;
_0x53a1xc[_0x208b[27]](20,0,String[_0x208b[26]](191));
_0x53a1xc[_0x208b[27]](0,0,String[_0x208b[26]](161));
_0x53a1xc[_0x208b[27]](12,1,String[_0x208b[26]](95));
for(sym in _0x53a1xc){
$(_0x208b[31]+_0x53a1xc[sym]+_0x208b[32])[_0x208b[30]](_0x208b[29])[_0x208b[11]](function(){
$(this)[_0x208b[10]](_0x208b[28])}
)}
;
$(_0x208b[33])[_0x208b[30]](_0x208b[29]);
$(_0x208b[29])[_0x208b[47]](_0x208b[46])[_0x208b[45]](function(){
if($(this)[_0x208b[0]]()==_0x208b[34]||$(this)[_0x208b[0]]()==_0x208b[35]||$(this)[_0x208b[0]]()==_0x208b[36]||$(this)[_0x208b[0]]()==_0x208b[37]||$(this)[_0x208b[0]]()==_0x208b[38]||$(this)[_0x208b[0]]()==_0x208b[39]||$(this)[_0x208b[0]]()==_0x208b[40]||$(this)[_0x208b[0]]()==_0x208b[41]||$(this)[_0x208b[0]]()==_0x208b[42]||$(this)[_0x208b[0]]()==_0x208b[43]){
$(this)[_0x208b[44]](_0x208b[28])}
}
);
var _0x53a1xe=parseInt($(_0x208b[1])[_0x208b[0]]());
var _0x53a1xf=1;
$(_0x208b[49])[_0x208b[2]](150,function(){
var _0x53a1x3=parseInt($(_0x208b[48])[_0x208b[0]]());
if(_0x53a1x3>_0x53a1xf){
_0x53a1x3--;
$(_0x208b[48])[_0x208b[0]](_0x53a1x3);
}
;
}
);
$(_0x208b[50])[_0x208b[2]](150,function(){
_0x53a1xe=parseInt($(_0x208b[1])[_0x208b[0]]());
var _0x53a1x3=parseInt($(_0x208b[48])[_0x208b[0]]());
if(_0x53a1x3<_0x53a1xe){
_0x53a1x3++;
$(_0x208b[48])[_0x208b[0]](_0x53a1x3);
}
;
}
);
$(_0x208b[48])[_0x208b[6]](function(_0x53a1x4){
if(_0x53a1x4[_0x208b[5]]==38){
var _0x53a1x3=parseInt($(_0x208b[48])[_0x208b[0]]());
if(_0x53a1x3<_0x53a1xe){
_0x53a1x3++;
$(_0x208b[48])[_0x208b[0]](_0x53a1x3);
}
;
}
;
if(_0x53a1x4[_0x208b[5]]==40){
var _0x53a1x3=parseInt($(_0x208b[48])[_0x208b[0]]());
if(_0x53a1x3>_0x53a1xf){
_0x53a1x3--;
$(_0x208b[48])[_0x208b[0]](_0x53a1x3);
}
;
}
;
}
);
$(_0x208b[51])[_0x208b[11]](function(){
$(this)[_0x208b[10]](_0x208b[19])}
);
function _0x53a1x10(_0x53a1x3,_0x53a1x11,_0x53a1x12,_0x53a1x13,_0x53a1x14,_0x53a1x15,_0x53a1x16){
var _0x53a1x17=_0x208b[52];
var _0x53a1x18= new Array();
$(_0x208b[29])[_0x208b[47]](_0x208b[46])[_0x208b[45]](function(){
if($(this)[_0x208b[13]](_0x208b[28])){
_0x53a1x18[_0x208b[53]]($(this)[_0x208b[0]]())}
}
);
var _0x53a1x19=$(_0x208b[48])[_0x208b[0]]();
var _0x53a1x1a= new Array();
var _0x53a1xd=0;
var _0x53a1x1b=0;
while(_0x53a1xd<_0x53a1x3){
var _0x53a1x1c=Math[_0x208b[55]](Math[_0x208b[54]]()*4)+1;
var _0x53a1x1d=_0x53a1x18[Math[_0x208b[55]](Math[_0x208b[54]]()*_0x53a1x18[_0x208b[56]])];
var _0x53a1x1e=Math[_0x208b[55]](Math[_0x208b[54]]()*10);
var _0x53a1x1f=String[_0x208b[26]](Math[_0x208b[55]](Math[_0x208b[54]]()*26)+97);
var _0x53a1x20=String[_0x208b[26]](Math[_0x208b[55]](Math[_0x208b[54]]()*26)+65);
switch(_0x53a1x1c){
case 1:if(_0x53a1x12){
if(!_0x53a1x15||(_0x53a1x15&&_0x53a1x1f!=_0x208b[57]&&_0x53a1x1f!=_0x208b[58]&&_0x53a1x1f!=_0x208b[59])){
_0x53a1x17+=_0x53a1x1f;
_0x53a1xd++;
}
}
;
break;
;
case 2:if(_0x53a1x11){
if(!_0x53a1x15||(_0x53a1x15&&_0x53a1x20!=_0x208b[60]&&_0x53a1x20!=_0x208b[61]&&_0x53a1x20!=_0x208b[62])){
_0x53a1x17+=_0x53a1x20;
_0x53a1xd++;
}
}
;
break;
;
case 3:if(_0x53a1x13){
if(!_0x53a1x15||(_0x53a1x15&&_0x53a1x1e!=_0x208b[63]&&_0x53a1x1e!=_0x208b[64])){
_0x53a1x17+=_0x53a1x1e;
_0x53a1xd++;
}
}
;
break;
;
case 4:if(_0x53a1x14&&_0x53a1x1b<_0x53a1x19&&(_0x53a1x16||!_0x53a1x16&&$[_0x208b[65]](_0x53a1x1d,_0x53a1x1a)== -1)){
_0x53a1x17+=_0x53a1x1d;
_0x53a1x1a[_0x208b[53]](_0x53a1x1d);
_0x53a1x1b++;
_0x53a1xd++;
break;
}
;
;
}
;
}
;
return _0x53a1x17;
}
$(_0x208b[68])[_0x208b[11]](function(){
var _0x53a1x3=parseInt($(_0x208b[1])[_0x208b[0]]());
_0x53a1xb();
if(!_0x53a1x5&&!_0x53a1x6&&!_0x53a1x7&& !_0x53a1x8){
alert(_0x208b[66])}
else{
var _0x53a1x17=_0x53a1x10(_0x53a1x3,_0x53a1x5,_0x53a1x6,_0x53a1x7,_0x53a1x8,_0x53a1x9,_0x53a1xa);
$(_0x208b[67])[_0x208b[0]](_0x53a1x17);
}
;
}
);
$(_0x208b[12])[_0x208b[72]](function(){
var _0x53a1x21=$(this)[_0x208b[70]](_0x208b[69]);
$(_0x208b[71])[_0x208b[0]](_0x53a1x21);
}
,function(){
$(_0x208b[71])[_0x208b[0]](_0x208b[52])}
);
}
);
CSS代码(style.css):
body{font-family:'Lato',sans-serif;font-weight:300;background-color:#6cc1ed;padding-top:30px;}
h1{font-size:25px;font-weight:400;color:#fff;text-align:center;}
#container{margin:0 auto;width:100%;max-width:400px;margin-top:30px;}
#content{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:30px;width:100%;height:100%;float:left;background-color:rgba(255,255,255,.2);box-shadow:0 1px 2px rgba(0,0,0,.15);margin-bottom:15px;}
#pswcampbox{margin:5px auto 15px auto;width:97%;height:60px;color:#888;}
#pswcampbox #pswcamp{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;padding:20px 10px 0 10px;text-align:center;float:left;background-color:#fff;}
#pswcampbox #pswcamp span{outline:none;-webkit-outline:none;}
.option{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:31.3%;height:50px;float:left;margin-left:1.5%;margin-bottom:5px;background-color:rgba(235,235,235,.4);border:1px solid rgba(255,255,255,.6);cursor:pointer;transition:background-color ease-in-out .15s;-webkit-transition:background-color ease-in-out .15s;-moz-transition:background-color ease-in-out .15s;-o-transition:background-color ease-in-out .15s;text-align:center;line-height:50px;color:rgba(0,0,0,.3);-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;}
.option:hover{background-color:rgba(235,235,235,.6);}
.option.active{background-color:rgba(255,255,255,1);color:rgba(0,0,0,.7);}
#number.active{background-color:rgba(235,235,235,.4);}
#options .option .less,#options .option .more,#generate{-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;}
#options .option .value{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:100%;width:40%;float:left;background-color:#fff;color:#888;outline:none;-webkit-outline:none;}
#options .option .less,#options .option .more{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:100%;width:30%;float:left;font-size:25px;color:#ccc;background-color:#f1f1f1;}
#options .option .less{border-right:1px solid #ddd;}
#options .option .more{border-left:1px solid #ddd;}
.option #symbolOptions{float:right;height:100%;width:15px;color:#ccc;border-left:1px dashed #ddd;background-color:#fafafa;}
#symbolsSelectorContainer{float:left;width:100%;height:auto;display:none;}
#symbolsSelector{width:100%;height:auto;float:left;display:flex;display:-webkit-flex;display:-moz-flex;justify-content:flex-start;-webkit-justify-content:flex-start;-moz-justify-content:flex-start;align-items:center;-webkit-align-items:center;-moz-align-items:center;flex-wrap:wrap;-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;padding-bottom:15px;padding-top:5px;border:1px dashed #6cc1ed;margin-top:10px;}
#symbolsSelector #maxSymbolsNumberBox{width:100%;height:35px;margin-bottom:5px;}
#symbolsSelector #maxSymbolsNumberBox span{float:right;text-align:right;height:35px;line-height:35px;color:#fff;}
#symbolsSelector #maxSymbolsNumberBox #maxSymbolsNumber{width:120px;height:100%;float:right;margin-right:4px;margin-left:10px;background-color:#fff;}
#symbolsSelector #maxSymbolsNumberBox #maxSymbolsNumber span{float:left;text-align:center;line-height:35px;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;cursor:pointer;}
#symbolsSelector #maxSymbolsNumberBox #maxSymbolsNumber span.suma,#symbolsSelector #maxSymbolsNumberBox #maxSymbolsNumber span.resta{width:35px;background-color:#f1f1f1;color:#ccc;font-size:25px;}
#symbolsSelector #maxSymbolsNumberBox #maxSymbolsNumber span.suma{border-left:1px solid #ddd;}
#symbolsSelector #maxSymbolsNumberBox #maxSymbolsNumber span.resta{border-right:1px solid #ddd;}
#symbolsSelector #maxSymbolsNumberBox #maxSymbolsNumber span.maxSymbolValue{width:48px;color:#888;}
#symbolsSelector #symbolBox{border:1px solid #fff;background-color:rgba(255,255,255,.3);width:35px;height:35px;text-align:center;line-height:35px;color:#666;margin-top:5px;margin-left:5px;cursor:pointer;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;}
#symbolsSelector #symbolBox.selected{background-color:rgba(255,255,255,.7);}
#symbolsSelector #repeatSymbolsBox{width:100%;height:35px;float:left;}
#symbolsSelector #repeatSymbols{width:auto;height:35px;float:right;margin-right:5px;margin-top:10px;}
#symbolsSelector #repeatSymbols span{float:left;height:35px;line-height:35px;color:#fff;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;}
#symbolsSelector #repeatSymbols #checkBox{float:left;width:25px;height:25px;border:1px solid #fff;margin-left:10px;margin-top:5px;cursor:pointer;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;}
#symbolsSelector #repeatSymbols #checkBox div{width:15px;height:15px;float:left;margin-top:5px;margin-left:5px;}
#symbolsSelector #repeatSymbols #checkBox div.checked{background-color:#fff;}
#pswcamp #generate{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding-top:20px;width:60px;height:60px;float:right;background-color:#ACFA58;color:#fff;margin-right:-10px;margin-top:-20px;cursor:pointer;font-weight:400;}
p#option-desc{width:100%;text-align:center;color:#555;text-shadow:0 1px 1px rgba(235,235,235,.3);}