xgqfrms™, xgqfrms® : xgqfrms's offical website of cnblogs! xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

css3 & box-shadow

css3 & box-shadow

box-shadow

https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow

https://css-tricks.com/almanac/properties/b/box-shadow/

https://css-tricks.com/snippets/css/css-box-shadow/

https://cssreference.io/property/box-shadow/

http://www.css3.info/preview/box-shadow/

https://www.cssmatic.com/box-shadow

https://tailwindcss.com/docs/box-shadow/

https://html-css-js.com/css/generator/box-shadow/


@charset "UTf-8";

/* business.css */

.business-container{
    position: relative;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    width: calc(6.7rem);
    height: calc(1.86rem);
    background:rgba(70,165,255,1);
    box-shadow: 0rem 0.04rem 0.08rem 0rem rgba(15,21,33,0.2);
    border-radius: 0.12rem;
    margin-left: 0.2rem;
    margin-top: 0.2rem;
    border-radius: 0.08rem;
    /* 62 28 */
    transform: translateX(-0.2rem);
    color:#fff;
}


.business-container-self{
    background:linear-gradient(270deg,rgba(75,151,250,1) 0%,rgba(35,106,255,1) 100%);
    color:rgba(48,48,61,1);
    box-shadow: 0rem 0.04rem 0.08rem 0rem rgba(15,21,33,0.2);
    /* transform: translateX(0); */
}

.business-container-white{
    background:rgba(255,255,255,1);
    color:rgba(48,48,61,1);
}




posted @ 2019-07-04 20:16  xgqfrms  阅读(194)  评论(0编辑  收藏  举报