赞最多的那个,光影关系明显错了好吧,看看我这个对比一下光影关系
.boxshadow-outset{
width:100px;
height:100px;
box-shadow:4px 4px 6px 1px #666,
-10px -10px 50px 10px #888 inset;
border-radius:50px;
}
.boxshadow-outset{
width:100px;
height:100px;
box-shadow:4px 4px 6px 1px #666,
-10px -10px 50px 10px #888 inset;
border-radius:50px;
}
2017-07-08
/*制作圆*/
border-radius:10px;
/*制作导航立体风格*/
box-shadow:7px 6px 8px 3px #b64b41;
/*使用伪元素制作导航列表项分隔线*/
.nav li{ background:linear-gradient(to bottom,#f65f57,#a82724,#f65f57) no-repeat right / 2px 20px;}
/*删除第一项和最后一项导航分隔线*/
.nav li:last-child{background:none;}
border-radius:10px;
/*制作导航立体风格*/
box-shadow:7px 6px 8px 3px #b64b41;
/*使用伪元素制作导航列表项分隔线*/
.nav li{ background:linear-gradient(to bottom,#f65f57,#a82724,#f65f57) no-repeat right / 2px 20px;}
/*删除第一项和最后一项导航分隔线*/
.nav li:last-child{background:none;}
2017-07-04
/*制作圆*/
border-radius:10px;
/*制作导航立体风格*/
box-shadow:0 30px 100px #000;
/*使用伪元素制作导航列表项分隔线*/
.nav li{
background:linear-gradient(to bottom,#fff,green,pink) no-repeat left/1px 15px;
}
/*删除第一项和最后一项导航分隔线*/
.nav li:first-child{
background:none;
}
border-radius:10px;
/*制作导航立体风格*/
box-shadow:0 30px 100px #000;
/*使用伪元素制作导航列表项分隔线*/
.nav li{
background:linear-gradient(to bottom,#fff,green,pink) no-repeat left/1px 15px;
}
/*删除第一项和最后一项导航分隔线*/
.nav li:first-child{
background:none;
}
2017-07-03