下面是自己设计的一些标题栏,横幅,标签的样式

代码如下

 .biaoti {
  text-transform: uppercase;
  background: #ececec;
  color: #bfb5b5;
  font-family: "Gill Sans", Impact, sans-serif;
  font-size: 20px;
  padding: 15px 20px;
  position: relative;
  text-align: left;
  width: 50%;
  margin:10px;
}

.biaoti span{
  font-family:"Microsoft Yahei","Arial","黑体";
  font-weight: bold;
  color: #555;
  padding-right: 10px;
 
}  
.biaoti .title-green{
  width: 5px;
  height: 23px;
  background: #7cab0b;
  display: inline-block;
  margin-top: 3px;
  vertical-align: top;
  margin-right: 10px;
}
 .biaoti .title-blue{
  width: 5px;
  height: 23px;
  background:#10e4ef;
  display: inline-block;
  margin-top: 3px;
  vertical-align: top;
  margin-right: 10px;
}
 .biaoti .title-yellow{
  width: 5px;
  height: 23px;
  background: #ffd849;
  display: inline-block;
  margin-top: 3px;
  vertical-align: top;
    margin-right: 10px;

}
  
.biaoti .title-red{
  width: 5px;
  height: 23px;
  background: #ff57a4;
  display: inline-block;
  margin-top: 3px;
  vertical-align: top;
   margin-right: 10px;

}


还在继续更新中