zent/css/tag.css

一套前端设计语言和基于React的实现

.zent-tag {
  display: inline-block;
  font-size: 12px;
  color: #fff;
  line-height: 1;
  padding: 0.084em 0.417em;
  border: 1px solid #fff
}
.zent-tag.zent-tag-rounded {
  border-radius: 0.167em;
}
.zent-tag.zent-tag-closable .zent-tag-content {
      display: inline-block;
      margin-right: 0.417em;
}
.zent-tag.zent-tag-closable .zent-tag-close-btn {
      cursor: pointer;
      -webkit-transform: scale(0.6);
              transform: scale(0.6);
}
.zent-tag.zent-tag-style-red {
  background: #f44;
  border-color: #f44;
}
.zent-tag.zent-tag-style-red-outline {
  color: #f44;
  border-color: #f44;
}
.zent-tag.zent-tag-style-green {
  background: #4b0;
  border-color: #4b0;
}
.zent-tag.zent-tag-style-green-outline {
  color: #4b0;
  border-color: #4b0;
}
.zent-tag.zent-tag-style-yellow {
  background: #fc0;
  border-color: #fc0;
}
.zent-tag.zent-tag-style-yellow-outline {
  color: #fc0;
  border-color: #fc0;
}
.zent-tag.zent-tag-style-blue {
  background: #38f;
  border-color: #38f;
}
.zent-tag.zent-tag-style-blue-outline {
  color: #38f;
  border-color: #38f;
}
.zent-tag.zent-tag-style-darkgreen {
  background: #4b8;
  border-color: #4b8;
}
.zent-tag.zent-tag-style-darkgreen-outline {
  color: #4b8;
  border-color: #4b8;
}
.zent-tag a {
    color: inherit;
}