添加特色广告代码到WordPress文章（原始教程代码）

主题添加教程：

将下面的代码添加到主题的css文件，dux添加到mian.css

.feedback {   height: 80px;   margin: 0px -20px 0px -20px;   color: #fff;   overflow: hidden;   margin-bottom: 10px;  }    .fb-primary {   background-color: #50b7ff;  }    .fb-danger {   background-color: #ff5f53;  }    .fb-warning {   background-color: #f9c13e;  }    .fb-info {   background-color: #1ac5e2;  }    .fb-purple {   background-color: #b771e8;  }    .feedback span {   font-size: 28px;   float: left;   padding: 0px 0px 0px 20px;   line-height: 80px;  }    .feedback a {   margin: 22px 20px 0px 0px;   float: right;   position: relative;   height: 36px;   line-height: 36px;   border: 1px solid #fff;   display: inline-block;   font-size: 16px;   padding: 0 26px;   color: #fff;   text-decoration: none;  }    .feedback a:hover {   background-color: #fff;   color: #000000;   text-decoration: none  }    @media (max-width: 640px) {   .feedback span {    font-size: 12px;    float: left;    padding: 0px 0px 0px 20px;    line-height: 50px;   }     .feedback a {    margin: 12px 20px 0px 0px;    float: right;    position: relative;    height: 26px;    line-height: 26px;    border: 1px solid #fff;    display: inline-block;    font-size: 12px;    padding: 0 18px;   }     .feedback {    height: 50px;   }  }

前台调用样式（参考上方css演示）：

<div class="feedback fb-danger">  <span>Vieu主题v2系列 专注于工体美学</span>  <a href="链接地址" rel="external nofollow" >使用教程</a>  </div>

大功告成！

转载请注明：汇站网 » 添加特色广告代码到WordPress文章（原始教程代码）