js+css实现大气多标签选择器代码
代码语言:html
所属分类:选择器
代码描述:js+css实现大气多标签选择器代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>精美多选标签</title>
<style>
:root {
--primary-color: #4361ee;
--primary-light: #4895ef;
--secondary-color: #3f37c9;
--accent-color: #f72585;
--light-gray: #f8f9fa;
--medium-gray: #e9ecef;
--dark-gray: #495057;
--white: #fff;
--transition: all .3s cubic-bezier(0.25,0.8,0.25,1);
--shadow-sm: 0 1px 3px rgba(0,0,0,0.12);
--shadow-md: 0 4px 6px rgba(0,0,0,0.1);
--shadow-lg: 0 10px 15px rgba(0,0,0,0.1);
--radius-sm: 4px;
--radius-md: 8px;
--radius-lg: 16px;
--radius-full: 9999px
}
* {
box-sizing: border-box;
margin: 0;
padding: 0
}
body {
font-family: 'Noto Sans SC',sans-serif;
background-color: var(--light-gray);
color: var(--dark-gray);
line-height: 1.6;
padding: 20px
}
.container {
max-width: 800px;
margin: 40px auto;
padding: 30px;
background-color: var(--white);
border-radius: var(--radius-lg);
box-shadow: var(--shadow-md)
}
h1.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0