css布局绘制一只铅笔效果代码

代码语言:html

所属分类:布局界面

代码描述:css布局绘制一只铅笔效果代码

代码标签: 一只 铅笔 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">
  

  
  
  
<style>
body {
  font-size: 1vmin;
  background-color: #00ABC4;
}
body div {
  font-size: 1.45vmin;
  width: 93.5em;
  height: 3.7em;
  position: absolute;
  top: 50%;
  left: 49%;
  transform: translate(-50%, -50%);
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  background: linear-gradient(to right, rgba(183, 99, 9, 0.2), rgba(0, 0, 0, 0.2)) 90% 100%/0.5% 100%, radial-gradient(100% 100% at 50% 50%, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0) 51%, transparent 65%) 0.6% 49%/0.75em 0.4em, linear-gradient(15deg, .........完整代码请登录后点击上方下载按钮下载查看

网友评论0