[TUTORIAL]Plantilla para perfil

  1. #1
    Pues estuve viendo que algunos usuarios ponían códigos para plantillas de perfil, y quise diseñar un poco una.
    Espero realmente les guste, pueden verla implementada en mi perfil antes de ustedes implementarla.
    Cualquier duda o consulta, mandarme MP.


            <style>
    body {
    background: #00000B; /*Color del fondo puedes poner igualmente una imagen si gustas usando: url(link de tu imagen subida); .*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    font: 78% "Verdana";
    margin: 0 auto;
    padding: 0px 0;
    padding-left: 15%;
    padding-right: 15%;
    }

    body, td, th, tr {
    color: rgba(0, 0, 0, 0.69); /*Colores para el texto dentro de Biografía*/
    font-family: VAGRounded;
    }


    #header, #toolbar, #publi, .navigate_section, #admin_menu, #top, #up_pictures, #up_interests, #up_media, #up_write_comment, #profile_left, #up_about_me, #up_other_info, .pagesection, #footer, span.topslice, .windowbg2 span.botslice {
    display: none;
    }

    #bdy-l, #bdy-r, .windowbg, #bodyarea {
    background: #FFBF00;
    border-radius: 0px 0px 7px 7px;
    }

    .windowbg2 {
    color: #000;
    background-color: #F5DA81;
    border-radius: 7px 7px 7px 7px;
    padding: 10px;
    display: none;
    }

    #c {
    text-align: center;
    width: 850px;
    margin: 0 auto;
    border-style: solid;
    border-width: 0px 1px 1px 1px;
    border-radius: 0px 0px 7px 7px;
    padding: 10px;
    }

    #seeya {
    width: 480px;
    height: 270px;
    margin: 0 auto;
    background-image: url();
    }

    #comentario {
    text-align: center;
    width: 480px;
    height: 334px;
    margin: 0 auto;
    border-style: solid;
    border-width: 0px 1px 1px 1px;
    border-radius: 0px 0px 7px 7px;
    font-size: 15px;
    font-family: VAGRounded;
    color: #444;
    }

    #titulo2 {
    text-align: center;
    width: 463px;
    margin: 0 auto;
    color: #000;
    background-image: linear-gradient( to top right, #58c6cb, #000022);
    border-radius: 7px 7px 0px 0px;
    padding: 10px;
    margin-top: 15px;
    font-weight: bold;
    }

    .gt {
    display: none;
    }

    #forumposts {
    display: none;
    }

    #tit-inside {
    text-align: center;
    width: 763px;
    margin: 0 auto;
    color: #cace36;
    background-image: linear-gradient( to top right, #00000B, #d0d0ea);
    padding: 10px;
    margin-top: 15px;
    font-weight: bold;
    }

    #inside {
    text-align: center;
    width: 780px;
    height: 134px;
    margin: 0 auto;
    border-style: solid;
    border-width: 0px 1px 1px 1px;
    border-radius: 0px 0px 7px 7px;
    }

    Style Attribute {
    margin-top: 18px;
    background: rgba(242, 242, 242, 0.95);
    padding: 7px;
    border-radius: 5px;
    color: #ea0000; /*Color para la línea negra y letras de: © Todos los derechos reservados | Términos y condiciones | BoomBang Games - 2017*/
    box-shadow: 1px 3px rgba(0,0,0,0.2);
    margin-bottom: 35px;
    }

    .info {
    width: 852px;
    margin: 0 auto;
    color: #000;
    background-color: #EAAF00;
    border-radius: 7px 7px 0px 0px;
    padding: 10px;
    font: 20px "Verdana", "Arial", "Helvetica", sans-serif;
    }

    .info2 {
    color: #f546a5;
    font-size: 20px;
    margin-left: 7px;
    }

    .info3 {
    color: #2E64FE;
    font-size: 20px;
    margin-left: -63%;
    }

    .all {
    font-size: 17px;
    }

    #mp-send {
    color: #2E64FE;
    font-size: 16px;
    font-family: VAGRounded;
    }

    #mp-send:hover {
    color: red;
    }
    .topslice {
    display: none;
    }
    #contenido {
    width: 422px;
    color: black;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.93);
    border-radius: 4px;
    padding: 8px;
    padding-bottom: 20px;
    height: 350px;
    box-shadow: 1px 1px 1px 3px rgba(0,0,0,0.2);
    margin-top: 2%;
    margin-left: 27%;
    }

    #tit {
    width: 852px;
    padding: 10px;
    font: 20px "Verdana", "Arial", "Helvetica", sans-serif;
    text-align: center;
    margin: 0 auto;
    color: #fff; /*Color del título Biografía*/
    background-image: linear-gradient( to top right, #58c6cb, #000022); /*Colores para el globo título Biografía #58c6cb, #000022*/
    border-radius: 7px 7px 0px 0px;
    padding: 10px;
    margin-top: 15px;
    font-weight: bold;
    }

    #categorya {
    background-image: linear-gradient( to top right, #53B4F1, #53B4F1 );
    padding: 10px;
    border-radius: 5px;
    color: #FFF;
    font-family: VAGRounded;
    font-size: 20px;
    margin-bottom: 5px;
    }

    .picture {
    background-color: #4AA3B7;
    border-radius: 15px;
    margin-top: 3%;
    }
    </style>
    <div id="tit">
    <strong>Biografía</strong>
    </div>
    <div id="c">
    <table>
    <tr>
    <td>
    <table>
    <tbody>
    <tr>
    <td>
    <p>
    Texto de tu Biografía aquí.
    </p>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </table>
    <a id="mp-send" href="https://www.boombang.nl/forum/index.php?action=pm;sa=send;u=746">Enviar un mensaje privado a este Usuario.</a>
    <!--Aquí cambiar el ID = 746 por el suyo, sino los mensajes que les manden a ustedes, me llegarán a mí.-->
    </div>
    <div>
    <!--
    Para cambiar la canción solamente remplazar el siguiente código que va después de: embed/
    El cual sería: /qcujIdHS5Us
    -->
    <embed src="https://www.youtube.com/embed/qcujIdHS5Us?autoplay=1&amp;modestbranding=1&amp;showinfo=0&amp;iv_load_policy=3&amp;fs=0&amp;fs=0&amp;autohide=1&amp;controls=0&amp;disablekb=1&amp;start=0" type="text/html" width="0" height="0">
    </div>
  2. #2
    Me sirvió, gracias.
  3. #3
    Gracias Aurelio te la robaré y la editaré un poquito<3

Entra para escribir en el foro.