css tag输入框

CSS Tag输入框是网页开发中非常常见的一种输入框样式，它可以帮助用户快速输入、标记关键字，并方便后续对这些关键字进行处理。

.tag-input {
  display: inline-block;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

.tag-input:focus {
  outline: none;
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

CSS样式定义里，.tag-input是表示对目标class名为tag-input的元素进行样式定义，这里定义的样式包括了padding、font-size等常规属性，以及针对鼠标聚焦后的边框和阴影等样式。

使用这个样式的HTML代码可以很简单：

<input type="text" class="tag-input" placeholder="请输入标签">

上面的代码中，type=text表示输入框的类型是文本输入，class为tag-input表示应用上述CSS样式。

需要注意的是，这种输入框样式通常需要使用一些Javascript代码来完成标签的输入和管理。不过这里就不在CSS范畴内了。