Cómo crear: Notas adhesivas

Aprende cómo usar CSS para crear "notas adhesivas".

Notas adhesivas

Las notas adhesivas se pueden usar para notificar al usuario sobre eventos especiales: peligro, éxito, información o advertencia, etc.

¡Peligro!Algunos textos...

¡Éxito!Algunos textos...

¡Información!Algunos textos...

¡Advertencia!Algunos textos...

Prueba por tu cuenta

Cómo crear una nota adhesiva

Paso 1 - Añadir HTML:

<div class="danger">
  <p><strong>¡Peligro!</strong> Algunos textos...</p>
</div>

Paso 2 - Añadir CSS:

.danger {
  background-color: #ffdddd;
  border-left: 6px solid #f44336;
}

Prueba por tu cuenta

Páginas relacionadas

Tutoriales:¿Cómo crear mensaje de alerta?