Tabella circolare con Icone Social

« Older   Newer »
 
  Share  
.
  1.     Like  
     
    .
    Avatar

    Advanced Member

    Group
    Administrator
    Posts
    4,902
    Like
    +7

    Status
    Offline
    Tabella circolare con Icone Social

    Round_Social

    Cliccate qui per vedere l'anteprima: https://expo.blogfree.net/circularsocial

    Codice da inserire in Codici HTML (dove volete farlo apparire):
    HTML
    <!-- INIZIO TABELLA CON ICONE SOCIAL -->
    <table style="text-align: center; border: 2px solid orange; border-radius: 50%; background: radial-gradient(#06525a,#0f1111); box-shadow: rgba(0, 0, 0, 0.8) 0 0 9px 5px" width="300" height="300" cellspacing="50" cellpadding="0">

    <tr>
    <td style="text-align: center; border: 2px solid orange; border-radius: 50%; background: url(https://upload.forumfree.net/i/fc9719545/bgeffetto2.png); background-size: contain" width="200" height="200"></td>
    </tr>

    </table>
    <table class="round2_tbl" cellspacing="0" cellpadding="0">

    <tr>
    <td colspan="6"><a href="INSERIRE_LINK"><img alt="" src="https://upload.forumfree.net/i/bf1119333/facebok-icon.png"></a></td>
    </tr>

    <tr>
    <td colspan="6" height="16"></td>
    </tr>

    <tr>
    <td colspan="3"><a href="INSERIRE_LINK"><img style="float: left" src="https://upload.forumfree.net/i/bf1119333/blogger-icon.png"></a></td>
    <td colspan="3"><a href="INSERIRE_LINK"><img style="float: right" src="https://upload.forumfree.net/i/bf1119333/twitter-icon.png"></a></td>
    </tr>

    <tr>
    <td colspan="6" height="65"></td>
    </tr>

    <tr>
    <td colspan="3"><a href="INSERIRE_LINK"><img style="float: left" src="https://upload.forumfree.net/i/bf1119333/skype-icon.png"></a></td>
    <td colspan="3"><a href="INSERIRE_LINK"><img style="float: right" src="https://upload.forumfree.net/i/bf1119333/tumblr-icon.png"></a></td>
    </tr>

    <tr>
    <td colspan="6" height="17"></td>
    </tr>

    <tr>
    <td colspan="6"><a href="INSERIRE_LINK"><img alt="" src="https://upload.forumfree.net/i/bf1119333/youtube-icon.png"></a></td>
    </tr>

    </table> <!-- FINE TABELLA CON ICONE SOCIAL -->


    Codice da inserire in Colori e Stili:
    CODICE
    /* TABELLA ROTONDA CON ICONE SOCIAL */
    .round2_tbl {text-align: center; width: 270px; height: 300px; position: absolute; margin-top: -307px; margin-left: calc(50% - 145px)}
    .round2_tbl img {border: 2px solid transparent; border-radius: 50%}
    .round2_tbl img:hover {border: 2px solid orange}



    ATTENZIONE !!

    In base alla Skin del Forum/Blog che avete potrebbero esserci problemi di allineamento delle icone rispetto alla Tabella.
    Potete risolvere facilmente andando a correggere in Colori e Stili questa voce: .round2_tbl

    "Giocate" un po' con i valori del margin-left o margin-top fino ad allineare le Icone con la Tabella Circolare.

    Ovviamente dove c'é scritto "INSERIRE_LINK" dovrete inserire voi i link dei vostri Social.

    ;)

    .

    Edited by Akom74 - 29/4/2024, 22:18
     
    .
0 replies since 29/4/2024, 20:55   14 views
  Share  
.