CSS记录 - 2021-08-10

1、特殊背景

代码语言：javascript复制

background-image: linear-gradient( 
-45deg
 , rgba(34, 34, 34, 0.2) 12.5%, #0000 12.5%, #0000 50%, rgba(34, 34, 34, 0.2) 50%, rgba(34, 34, 34, 0.2) 62.5%, #0000 62.5%, #0000 100% );
    background-size: 8px 8px;

效果背景图：

2、CSS右箭头

代码语言：javascript复制

display: inline-block;
 width: 10px;
 height: 10px;
 border-top: 2px solid #222025;
 border-left: 2px solid #222025;
 transform: rotate(136deg);

3、浏览器Scroll Style

代码语言：javascript复制

 ::-webkit-scrollbar {
      width:10px;
      height: 8px;
      -webkit-box-shadow:rgba(9, 9, 25, 0.3);
      box-shadow:rgba(9, 9, 25, 0.3);
      background:rgba(15, 16, 18, 1);
    }

    ::-webkit-scrollbar-corner{
      background:#171A2A;
    }

    ::-webkit-scrollbar-track {
      -webkit-box-shadow:rgb(56, 57, 100,0.3);
      box-shadow:rgb(56, 57, 100,0.3);
      border: 1px solid #171A2A;
    }
    ::-webkit-scrollbar-thumb {
      border-radius:10px;
      background:rgba(62, 65, 77, 1);
      -webkit-box-shadow:rgb(56, 57, 100,0.5);
      box-shadow:rgb(56, 57, 100,0.5)
    }
    ::-webkit-scrollbar-thumb:window-inactive {
      background:rgba(62, 65, 77, 1);
    }

scroll 浏览器

0 人点赞