1. Con una cuenta podrás:

    • Publicar preguntas y pedir ayuda
    • Crear tutoriales
    • Acceder a contenido privado
    • Convertirte en un Héroe de la web
    Cerrar notificación
  2. Eres nuevo en la comunidad y necesitas ayuda?
    Sigue estos pasos y recomendaciones antes de publicar tu duda:
    Cerrar notificación

Ayuda Cambiar y añadir iconos de redes sociales

Tema en 'HTML y CSS' comenzado por invencion hq, 5 de Mayo de 2017.

  1. invencion hq

    invencion hq Nuevo Miembro

    Se incorporó:
    5 de Mayo de 2017
    Mensajes:
    9
    Me gusta recibidos:
    1
    Puntos de trofeos:
    3
    Género:
    Hombre
    Hola como están? espero que bien.
    Escribo para ver si me pueden ayudar en algunas cosas con mi blog, quiero agregarle el color original a los logos de redes sociales que tengo en mi pagina, a la hora de editar con html la social bar ( la que marque en rojo en la foto) solo tengo un solo background para esos 4 logos y no se como hacer que cada cuadrito tenga su margen con su respectivo color sin que interfiera con los otros logos, dejo imágenes de los códigos y lo que quiero cambiar.

    [​IMG]
    [​IMG]
    [​IMG] [​IMG]
    [​IMG]

    Nota: soy nuevo con lo de los códigos y diseños de paginas, por si no me explique bien o use los términos adecuados disculpen.

    Y otra cosa que tambien quiero que alguien me ayude o me explique para aprender, es como poner logos, imágenes, banner con html, css en el footer de mi pagina también dejo la foto donde quiero poner lo mencionado.

    [​IMG]

    Espero me puedan ayudar. Gracias!
     
  2. oscar fernando

    oscar fernando Miembro Activo

    Se incorporó:
    20 de Noviembre de 2015
    Mensajes:
    191
    Me gusta recibidos:
    138
    Puntos de trofeos:
    43
    Género:
    Hombre
    Ocupación:
    Estudiante
    Localización:
    colombia
    que tal amigo eso no es dificil
    un ejemplo seria asi
    HTML:
    <i class="fa fa-twitter iconos"></i>
    <i class="fa fa-facebook iconos"></i>
    <i class="fa fa-pinterest iconos"></i>
    <i class="fa fa-google-plus iconos"></i>
    y el css
    Código (CSS):
    .iconos{
                width: 50px;
                height: 50px;
                text-align:center;
                border-radius: 50%; //opcional me gustan redondos
                line-height: 50px;
                font-size: 30px;
            }
            .fa-twitter{
                color: #fff;
                background: steelblue;
           
            }
            .fa-facebook{
                color: #fff;
                background: steelblue;
            }
            .fa-pinterest{
                color: #fff;
                background: #F61B54;
            }
            .fa-google-plus{
                color: #fff;
                background: #CE4933;
            }
    recuerda que para cambiar el tamaño y color del icono utilizas las propiedades de font-size: npx y color:#ncolor; ya que esos iconos son fuentes..
    mmmm yo no se explicar jaja pero falconmasters si.. en estos dos cursos te enseñan eso y mucho mas.... o_O

     

    Archivos adjuntos:

    Última modificación: 5 de Mayo de 2017
    A invencion hq y AngelKrak les gusta esto.
  3. invencion hq

    invencion hq Nuevo Miembro

    Se incorporó:
    5 de Mayo de 2017
    Mensajes:
    9
    Me gusta recibidos:
    1
    Puntos de trofeos:
    3
    Género:
    Hombre
    Muchas gracias por ayudarme amigo, ya voy a probar poniéndolo en la pagina saludos! :)
     
  4. invencion hq

    invencion hq Nuevo Miembro

    Se incorporó:
    5 de Mayo de 2017
    Mensajes:
    9
    Me gusta recibidos:
    1
    Puntos de trofeos:
    3
    Género:
    Hombre
    Gracias por tomarte el tiempo de ayudarme amigo oscar fernando Me ayudaste un monton, yo tenia un par de días en eso :) [​IMG]
     
    A oscar fernando le gusta esto.
  5. oscar fernando

    oscar fernando Miembro Activo

    Se incorporó:
    20 de Noviembre de 2015
    Mensajes:
    191
    Me gusta recibidos:
    138
    Puntos de trofeos:
    43
    Género:
    Hombre
    Ocupación:
    Estudiante
    Localización:
    colombia
    de nada genial que te funcionara
     
    A invencion hq le gusta esto.

Comparte esta página