shoelace实现颜色主色选择生成器代码
代码语言:html
所属分类:选择器
代码描述:shoelace实现颜色主色选择生成器代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
html {
--spacing: 1.5rem;
--swatch-size: 55px;
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
body {
font: 16px system-ui, sans-serif;
display: flex;
flex-direction: column;
place-items: center;
height: calc(100vh - var(--spacing) * 2);
}
main {
display: inline-block;
color: rgb(var(--sl-color-neutral-500));
padding: var(--spacing);
margin: auto;
}
h1 {
font-size: 1.5rem;
font-weight: 300;
text-align: center;
margin: 0 0 var(--spacing) 0;
}
sl-card {
margin: 0 auto;
}
sl-card::part(base) {
--padding: var(--spacing);
border: none;
box-shadow: var(--sl-shadow-large);
}
#result {
display: grid;
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0