如何在底角显示广告上的链接文字

时间:2017-10-08 06:55:59

标签: html css

我有一个广告,如下面给出的jsfiddle。

jsfiddle

HTML

  <div class='pc_singleblock'>
  <div style='box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; overflow: hidden; text-align:center; font-size: 11px; font-family:helvetica; font-weight: bold; width:300px; height:250px; background:#E7E7E7; color:#666; line-height:250px;position:relative;'
  class='pc_block_active'>
    <a target='_blank' href='//cdn.adclerks.com/core/adclick/3485/3329' alt='Followlike' title='Followlike' style='width: 300px; height: 250px;'><img width=300 height=250 src='//static.adclerks.com/ads/3485.jpg' /></a>
    <div class="tag">Adtext</div>
  </div>
</div>

CSS

      <style type='text/css'>.pc_block a {
    color: #666!important;
    margin: 0;
    padding: 0;
  }

  .pc_block a:hover {
    color: #222!important;
  }

  .pc_block {
    margin: 0;
  }

  .pc_block:hover {
    margin: 0;
    background: #ddd;
    text-decoration: underline !important;
  }

  .pc_block_inactive {
    border: 1px solid #BBB;
  }

  .pc_block_inactive:hover {
    border: 1px solid #999;
  }

  </style>

我想在此广告上显示该广告的加法广告 右下角Demo ads。最初显示任何符号并更改为悬停时链接,如此演示页面所示。这该怎么做?提前谢谢。

1 个答案:

答案 0 :(得分:0)

您可以定位链接

  .pc_block_active {position: relative;}
  .tag {
     position: absolute;
     bottom: 0;
     right: 0;
  }

希望这项工作