Pregunta Usando Twitter Bootstrap glyphicons en CSS


Me gustaría agregar un glyphicon bootstrap de Twitter para reemplazar la referencia de la imagen en el archivo CSS a continuación, aunque no estoy seguro de cómo.

.edit-button {
  background: url('../img/edit.png') no-repeat;
  width: 16px;
  height: 16px;
}

En HTML, lo agregaría de la siguiente manera:

<i class="icon-search icon-white"></i>

¿Algunas ideas?

actualización: intenté lo siguiente, aunque solo muestra el ancho y alto en Firebug de Firefox:

.edit-button
{
  /* background: url('../img/edit.png') no-repeat; */
  background: url(../img/glyphicons-halflings.png) no repeat -96px -72px !important;
  width: 16px;
  height: 16px;
}

No estoy seguro de por qué no se recoge?


21
2018-01-09 15:40


origen


Respuestas:


Entonces, ¿por qué no usas <i> etiqueta para su edición botón? Prueba esto:

<button type="submit" name="edit" class="edit-button btn btn-primary">
   <i class="icon icon-edit icon-white"></i>
   Edit
</button>

3
2018-01-09 15:47



Me gusta usar el método: after o: before ...

HTML

<a href="http://glyphicons.com/" class="arrow">Click Here</a></div>

CSS

.arrow:after {
  font-family: "Glyphicons Halflings";
  content: "\e080";
}

Esto debería funcionar suponiendo que tienes las fuentes glyphicon (vienen gratis con Bootstrap)


107
2018-02-26 16:27



Preguntas populares