css span

  • amebelroj

    (@amebelroj)


    hace 9 años, 6 meses

    Hola quiero colorear unos iconos dentro de mi

    • para colorearlo uso la etoqueta <span> <span/> de modo las letras tenga colores distintos a los iconos pero yo quiero que cada icono tenga un color distinto como hago?

      • este es mi codigo

      <html>
      <head>
      <title>Menu Desplegable</title>
      <link rel=»stylesheet» href=»fonts/style.css» type=»text/css»>
      <style type=»text/css»>

      * {
      margin:0px;
      padding:0px;
      }

      #header {
      margin-top:50px;
      width:500px;
      }

      ul, ol {
      list-style:none;
      }

      .nav > li {
      float:left;
      }

      .nav li a {
      margin-top:20px;
      font-family:Helvetica;
      font-size: 18px;
      background-color:#007953;
      color:#fff;
      padding-top: 30px;
      text-decoration:none;
      padding-left:20px;
      display:block;
      box-shadow: 5px 0px 10px #001A50;
      -webkit-transition: padding-left 0.9s;
      -moz-transition: padding-left 0.9s;
      -ms-transition: padding-left 0.9s;
      transition: padding-left 0.9s;
      }

      .nav li a:hover {
      padding-left: 30px;
      background-color:#a0021c;
      }

      .nav li a:focus {
      padding-left: all;
      background-color: #003c71;
      }
      .nav li ul {
      position:absolute;
      min-width:140px;
      }

      .nav li:hover > ul {
      display:block;
      }

      .nav li ul li {
      position:relative;
      }

      .nav li ul li ul {
      right:-140px;
      top:0px;
      }

      .nav span {
      color: #ff8000;

      </style>
      </head>
      <body>
      <table id=»header»>
      <td><ul class=»nav»>

    • <span class=»icon-android»></span> Android
    • BlackBerry
    • <span class=»icon-apple»></span> iOS
    • <span class=»icon-windows8″></span> Windows Phone

      • </td>
      </table>
      </body>
      </html>

Viendo 3 respuestas - de la 1 a la 3 (de un total de 3)
  • Peter Olle

    (@peterolle)

    hace 9 años, 6 meses

    Así:

    .icon-android {
  aquí tu css
}

.icon-apple {
  aquí tu css
}

    Saludos.

    Iniciador del debate amebelroj

    (@amebelroj)

    hace 9 años, 6 meses

    como se hace ese cuadro donde colocaste el codigo?? no se, y ps antes de que respondieras ya habia probado colocando esa clase pero no me funciono lo tuve que hacer de otro modo distinto pero bueno me funciono que es lo importante, gracias de todas formas.

    Peter Olle

    (@peterolle)

    hace 9 años, 6 meses

    Pues no entiendo a que te refieres y no se que te funciona o no, porque dices que gracias de todas formas.

    Para poner código se utiliza el botón de «code».

    Si con el CSS que te puse se solucionó el tema, por favor márcalo como resuelto.

    Saludos.

Viendo 3 respuestas - de la 1 a la 3 (de un total de 3)
  • El debate ‘css span’ está cerrado a nuevas respuestas.