复制以下代码放到你需要添加的地方
<div class="n_banner_inner"> <div class="img-info"> <i class="b2font b2-information-line"></i> //此处ico图标自行替换引入,当前适用于B2主题 <div class="info">也想出现在这里? <a rel="nofollow noopener noreferrer" href="/circle/zhainan" target="_blank">联系我们</a>吧</div> </div> <a href="/circle/zhainan" target="_blank" rel="noopener noreferrer"> <div class="Banner-adTag">广告</div> <img class="tirr" src="https://lz.sinaimg.cn/large/008qcEpJly1hbrvrze29bj30xi095wju.jpg" alt="广告位招租"> </a> </div> <style> /*定位*/ .n_banner_inner { position: relative; } /*提示信息*/ .n_banner_inner .img-info { position: absolute; right: 12px; top: 9px; padding: 0; text-align: right; color: #fff; } .n_banner_inner .img-info i { position: relative; display: inline-block; color: #09105a; font-size: 20px; line-height: 19px; text-align: center; z-index: 9; font-style: inherit; } .n_banner_inner .img-info .info { position: absolute; bottom: 3px; right: 0; width: 0; padding: 5px 0; overflow: hidden; background: #ffa500; border-radius: 10px; line-height: 10px; text-align: center; font-size: 10px; color: #fff; white-space: nowrap; -webkit-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; -moz-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; -ms-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; -o-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; } .n_banner_inner .img-info .info a { color: #fff; } .n_banner_inner .tirr { max-width: 100%; height: auto; transition: 0.5s; border-radius: 5px; } /*触发Hover*/ .n_banner_inner:hover .info { width: auto; padding: 5px 23px 5px 12px; -webkit-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; -moz-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; -ms-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; -o-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important; font-size: 12px; z-index: 1; } .n_banner_inner img:hover { filter: brightness(50%); } /*触发声明hover*/ .n_banner_inner .info:hover a { color: red; text-decoration: none; } /*左下角广告*/ .n_banner_inner .Banner-adTag { position: absolute; left: 5px; bottom: 5px; width: 35px; border: 1px solid #09105a; border-radius: 5px; color: #09105a; opacity: 0.5; font-size: 12px; /*line-height: 20px;*/ text-align: center; } @media screen and (max-width: 768px) { .n_banner_inner .img-info { display: none; } } </style>