|
Ejemplos de CSS |
|
|
|
|
Ejemplos de CSS |
|
|
Ejemplos de CSS
|
Ejemplos de CSS |
|
|
|
|
Ejemplos de CSS |
|
|
A continuación estos son los ejemplos y preguntas más habituales de personalización tanto en rótulos como en campos.
Hemos puesto el ejemplo gráfico usando un formulario de color blanco de fondo y como color a personalizar el Rojo 100% (#FF0000;) con el fin de facilitar la visualización de los cambios.
Seleccione el contenedor/caja que desea personalizar y en estilo Escriba: background-color:#FF0000; donde "#FF0000;" equivale al color que desea poner |
Seleccione el campo que desea modificar, pulse Editar y vaya al campo Campo Cell Style Escriba: text-size=14px; donde "14px" equivale al tamaño en pixel de la fuente a cambiar |
Seleccione el campo que desea modificar, pulse Editar y vaya al campo Rótulo Cell Style Escriba: text-align:left; donde "left" equivale a la posición del texto, puede utilizar left-center-right entre otras opciones |
Seleccione el campo que desea modificar, pulse Editar y vaya al campo Rótulo Cell Style Escriba: vertical-align:top; donde "top" equivale ala posición del elemento en el area, puede utilizar top-middle-bottom entre otras opciones |
Seleccione el campo que desea modificar, pulse Editar y vaya al campo Campo Cell Style Escriba: text-align:right;vertical-align:top; donde "right y top" asignan la posición del elemento |
Seleccione el campo que desea modificar, pulse Editar y vaya al campo Campo Cell Style Escriba: text-align:center;vertical-align:middle; donde "center y middle" asignan la posición del elemento horizontal y vertical repectivamente |
En la caja que desee asignar este estilo escriba: background-image:url(ruta/archivo.jpg);background-repeat:repeat-x;background-position:left top; donde ruta/archivo.jpg corresponde a la imagen que se usará de fondo en la ruta del servidor donde esté |
Recuerde que las normas CSS le permiten agrupar elementos como por ejemplo:
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0px;
padding: 0px;
border: 0px;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
}
También hay varios selectores los propios del HTML (body, div, html, h1, etc...), los de identidad (#micaja #midiv) y los de clase (.estilo .cajacoloreada ), además también puede crear subclases como en el caso de los links:
a {
text-decoration:none;
color:#000000;
}
a:hover{
color:#0F0F00;
}
a:link{
color:#FF0000;
}
a:visited{
color:#00FF00;
}
