►►► H0TN€M€§I§ ►►►

Resaltar CSS

 Resaltar Mensajes CSS


 
Texto por encima de la pagina o antes del codigo 
 
Código:

<style type="text/css"> 
.alerta { 
background: #fff6bf url(http://xyberneticos.com/demos/Mensajes_css/images/error.gif) center no-repeat; 
background-position: 15px 50%; /* x-pos y-pos */ 
text-align: left; 
padding: 5px 20px 5px 45px; 
border-top: 2px solid #ffd324; 
border-bottom: 2px solid #ffd324; 
color:#000000; 
} 
</style>


Donde quieres que resalte el texto 
 
Código:
<p class="alerta">El texto</p>


 
Texto por encima de la pagina o antes del codigo 
 
Código:

<style type="text/css"> 
.info { 
background: #fff6bf url(http://xyberneticos.com/demos/Mensajes_css/images/info.gif) center no-repeat; 
background-position: 15px 50%; /* x-pos y-pos */ 
text-align: left; 
padding: 5px 20px 5px 45px; 
border-top: 2px solid #ffd324; 
border-bottom: 2px solid #ffd324; 
color:#000000; 
} 
</style>



 
Código:
<p class="info">El texto</p>


 
Texto por encima de la pagina o antes del codigo 
 
Código:

<style type="text/css"> 
.importante { 
background: #fff6bf url(http://xyberneticos.com/demos/Mensajes_css/images/importante.gif) center no-repeat; 
background-position: 15px 50%; /* x-pos y-pos */ 
text-align: left; 
padding: 5px 20px 5px 45px; 
border-top: 2px solid #ffd324; 
border-bottom: 2px solid #ffd324; 
color:#000000; 
} 
</style>


Donde quieres que resalte el texto 
 
Código:
<p class="importante">El texto</p>



 
Texto por encima de la pagina o antes del contenido 
 
Código:
<style type="text/css"> 
.fuente { 
background: #F7F9E5 url(http://xyberneticos.com/demos/Mensajes_css/images/via.gif) center no-repeat; 
background-position: 15px 50%; /* x-pos y-pos */ 
text-align: left; 
padding: 5px 20px 5px 45px; 
border-top: 2px solid #DBDCCD; 
border-bottom: 2px solid #DBDCCD; 
color:#000000; 

} 
.fuente a{ 
color:#4B4B4B; 
text-decoration:none; 
border-bottom:1px dotted #444; 
} 
</style>


Donde quieres que resalte el texto 
 
Código:
<p class="fuente">Fuente <a href="#">Mi fuente</a></p>



 
Texto por encima de la pagina o antes del contenido 
 
Código:
<style type="text/css"> 
.descarga { 
background: #FBC895 url(http://xyberneticos.com/demos/Mensajes_css/images/descargared.gif) center no-repeat; 
background-position: 15px 50%; /* x-pos y-pos */ 
text-align: left; 
padding: 5px 20px 5px 45px; 
border-top: 2px solid #F7AB75; 
border-bottom: 2px solid #F7AB75; 
color:#000000; 

} 
.descarga a { 
color:#E15F13; 
text-decoration:none; 
border-bottom:1px dotted #E15F13; 
} 
</style>


Donde quieres que resalte el texto 
 
Código:
<p class="descarga"> Enlace <a href="#">Descargar</a> </p>



 
Texto por encima de la pagina o antes del contenido 
 
Código:
<style type="text/css"> 
.nota { 
background: #FAF9F7 url(http://xyberneticos.com/demos/Mensajes_css/images/nota.gif) center no-repeat; 
background-position: 15px 50%; /* x-pos y-pos */ 
text-align: left; 
padding: 5px 20px 5px 45px; 
border-top: 2px solid #F2EFEA; 
border-bottom: 2px solid #F2EFEA; 
color:#000000; 

} 
</style>


Donde quieres que resalte el texto 
 
Código:
<p class="nota">Mi texto.</p>



 
Texto por encima de la pagina o antes del contenido 
 
Código:
<style type="text/css"> 
.nuevo { 
background: #fff6bf url(http://xyberneticos.com/demos/Mensajes_css/images/new.gif) center no-repeat; 
background-position: 15px 50%; /* x-pos y-pos */ 
text-align: left; 
padding: 5px 20px 5px 45px; 
border-top: 2px solid #FBC383; 
border-bottom: 2px solid #FBC383; 
color:#000000; 
} 
.nuevo a { 
color:#E15F13; 
text-decoration:none; 
border-bottom:1px dotted #E15F13; 
} 
</style>

Donde quieres que resalte el texto 
 
Código:
<p class="nuevo">Actualizacion: En el siguiente <a href="#">post</a>bla bla bla</p>
 
Material
Noticias y Farandula
Link's final 3
Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis