[기타] 50 x 50 링크박스 예시입니다.

<div align="center">

<a href="http://www.inven.co.kr/webzine/" target="_BLANK">

<div style="display:inline-block; width:50px; height:50px; margin:2px; border:2px solid red; border-radius:5px; background:url('https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg') center / 100% 100% no-repeat;">

</div>

</a>

<a href="http://imart.inven.co.kr/attendance/" target="_BLANK">

<div style="display:inline-block; width:50px; height:50px; margin:2px; border:2px solid red; border-radius:5px; background:url('https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg') center / 100% 100% no-repeat;">

</div>

</a>

<a href="http://overwatch.inven.co.kr/" target="_BLANK">

<div style="display:inline-block; width:50px; height:50px; margin:2px; border:2px solid red; border-radius:5px; background:url('https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg')center / 100% 100% no-repeat;">

</div>

</a>

</div>

 

*~ ------------------------------------------------------------------------------ ~*

++ 오버/아웃 CSS 및 글씨 추가

<div align="center">

<a href="http://www.inven.co.kr/webzine/" target="_BLANK">

<div style="display:inline-block; overflow:hidden; width:50px; height:50px; margin:2px; border:2px solid red; border-radius:5px; background:url('https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg') center / 100% 100% no-repeat;">

<div style="display:table-cell; vertical-align:middle; width:50px; height:50px; border:none; border-radius:3px; background:rgba(255,255,255,0); color:rgba(255,255,255,0); opacity:1; transition:0.3s;"

data-inven-over-css="{'_SELF_':{'background-color':'rgba(255,128,128,1)','color':'rgba(255,255,255,1)'}}"

data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}">

<div style="font-size:13px; font-weight:bold; line-height:0px; text-align:center;">웹진</div>

</div>

</div>

</a>

<a href="http://imart.inven.co.kr/attendance/" target="_BLANK">

<div style="display:inline-block; width:50px; height:50px; margin:2px; border:2px solid red; border-radius:5px; background:url('https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg') center / 100% 100% no-repeat;">

<div style="display:table-cell; vertical-align:middle; width:50px; height:50px; border:none; border-radius:3px; background:rgba(255,255,255,0); color:rgba(255,255,255,0); opacity:1; transition:0.3s;"

data-inven-over-css="{'_SELF_':{'background-color':'rgba(128,255,128,1)','color':'rgba(255,255,255,1)'}}"

data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}">

<div style="font-size:13px; font-weight:bold; line-height:0px; text-align:center;">출첵</div>

</div>

</div>

</a>

<a href="http://overwatch.inven.co.kr/" target="_BLANK">

<div style="display:inline-block; width:50px; height:50px; margin:2px; border:2px solid red; border-radius:5px; background:url('https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg')center / 100% 100% no-repeat;">

<div style="display:table-cell; vertical-align:middle; width:50px; height:50px; border:none; border-radius:3px; background:rgba(255,255,255,0); color:rgba(255,255,255,0); opacity:1; transition:0.3s;"

data-inven-over-css="{'_SELF_':{'background-color':'rgba(128,128,255,1)','color':'rgba(255,255,255,1)'}}"

data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}">

<div style="font-size:13px; font-weight:bold; line-height:0px; text-align:center;">옵벤</div>

</div>

</div>

</a>

</div>

웹진

출첵

옵벤