domingo, 10 de noviembre de 2013

Cómo combinar botón Colores HTML con la fuente

Combine únicos coloresy fuentes para personalizar los botones.

 

COMBINAR EL BOTÓN

Antes de CSS, diseñadores web fuentes mezcladas y colores en el mismo código que compone los elementos de la página Web. Un botón HTML, por ejemplo, podría haber contenido la etiqueta "input" que define el botón y una etiqueta "font" para establecer la fuente del botón. Desarrolladores inteligentes utilizan ahora Cascading Style Sheets para separar el código que crea un elemento de la página web desde el código que le dice a los navegadores cómo mostrarlo. Cuando usted necesita para añadir un toque de estilo a una página Web, el estilo de los botones fuentes y colores que utilizan clases CSS.

 

Abra el Bloc de notas o cualquier editor HTML. Copie el código que aparece a continuación y pegarlo en la sección de la carrocería de un nuevo documento HTML:

 

clase de entrada type = "style1" = valor "botón" = "Botón 1" /

 

clase de entrada type = "style2" = valor "botón" = "Botón 2" /

 

Este código crea dos botones que hacen referencia a dos clases CSS denominado "style1" y "style2." Esas clases de controlar cómo los botones aparecen en la página Web.

 

Pegue el código siguiente en la sección "head" del documento:

 

. Style1 {color: red; background-color: yellow; font-size: 2em; font-weight: bold; font-family: "Times New Roman", Arial, serif;}

 

. Style2 {{color: blue; font-size: 0.8em; font-weight: bold; font-family: Georgia, Helvetica, Arial;}

 

Este código CSS crea el "style1" y clases "style2" hacen referencia los botones en el paso anterior. Tenga en cuenta los atributos de cada clase. El atributo de color establece el color del texto de primer plano del botón. El fondo-atributo controla el color de fondo del botón. El atributo font-size, establece en unidades 2em en la primera clase, determina el tamaño del texto del botón. El atributo font-family dice navegadores para tratar de utilizar la lista de fuentes que se muestran en el orden en que aparecen. Ponga paréntesis alrededor de los nombres de fuentes que contienen espacios, como "Times New Roman".

 

Guarde el documento y verlo en cualquier navegador. Los dos botones se mostrarán las características de color y tipo de letra definidos en las definiciones de clase de estilo CSS. El segundo botón no tiene ningún color de fondo porque la clase style2 que hace referencia no se estableció esa propiedad.

 

Consejos y advertencias

Es una buena idea para especificar una lista de nombres de fuente que desee en el atributo font-family CSS porque algunos usuarios pueden no tener el tipo de letra deseado instalado en sus equipos. En tales casos, su navegador no harán caso de que la fuente y el intento de usar el siguiente en la lista.

 

Al experimentar con diferentes combinaciones de CSS, puede producir una variedad de la costumbre, busca todos los botones HTML.

 

 

1 comentario: