用jquery写一个标签输入框,按回车自动添加标签
代码语言:html
所属分类:表单美化
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Tag Input Field</title>
<style>
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
body {
font-family: "Open Sans";
border: 0;
margin: 0;
background: #4aa3df;
}
a {
text-decoration: none;
color: black;
}
input:focus {
outline-width: 0;
}
h1 {
text-align: center;
color: white;
font-size: 2em;
background: rgba(70,70,70,0.7);
border: 1px solid rgba(255,255,255,0.3);
padding: 1em;
width: 60%;
border-radius: 0.5em;
margin: 3em auto;
}
.container {
background: rgba(70,70,70,0.3);
width: 80%;
margin: 5em auto;
border: 1px solid rgba(255,255,255,0.3);
border-radius: 0.25em;
padding: 1em;
}
.tagfield {
background: white;
border: 1px solid grey;
padding: 0.5rem;
font-size: 0.8em;
cursor: text;
}
.tag {
margin: 2px 3px;
color: black;
background: #eaebed;
padding: 6px 24px 6px 15px;
border-radius: 2px;
position: relative;
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0