Calendar

<< 12月 >>
 1234
567891011
12131415161718
19202122232425
262728293031  

Mobile

  • CSSでdivエリア全体をクリック出来るようにする
  • 2011.12.14
  • 【HTML】
    <div class=”comment”>
     <p class=”linkarea”>
     <a href=”hogehoge.html”>このリンクテキストは表示されない</a>
     ここにテキストがはいる
     </p>
    </div>

     

    【CSS】
    div.comment {
     position: relative;
     width: 100% ;
     min-height:100px;
     margin:0;
    }
    div.comment p.linkarea {
     margin:0;
     padding:0;
    }
    div.comment p.linkarea a {
     display: block ;
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     text-indent:-999px;
     background/***/: #fff9; /*IE7、8用ハック*/
     filter:alpha(opacity=0); /*フィルターで透明に*/
    }

    この例だと、commentというdivを起点として透明なリンクエリア(linkarea)をdiv全体に重ねているイメージ。
    リンクテキストはテキストを飛ばしているので記入されていても表示はされません。

【この記事のタグ】
CSSでdivエリア全体をクリック出来るようにする はコメントを受け付けていません

▲ PAGE TOP