css实现钢板凹凸背景效果代码

代码语言:html

所属分类:背景

代码描述:css实现钢板凹凸背景效果代码

代码标签: css 钢板 凹凸 背景

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

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

<head>
  <meta charset="UTF-8">

  
  
  
<style>
body{
    padding: 100px;
}
div {
  --lg:
  	repeating-linear-gradient(90deg,
  			#888 0,
  			currentcolor 0.1125em 0.1875em,
  			#999 0.25em, #0000 0 0.5em)
  		 content-box;
  --su: calc(100% - 0.125em)/ 0.5em 100% content-box;
  box-sizing: border-box;
  padding: 0.625em 1.625em;
  width: 5.5em;
  height: 2.5em;
  border-radius: 1.25em;
  background: var(--lg) 0/100% calc(100% - 0.25em) no-re.........完整代码请登录后点击上方下载按钮下载查看

网友评论0