La elección del color en el texto y el tipo de fuente que se aplica al documento HTML que creamos es una de las cosas importantes que hay que considerar y considerar. Donde la fuente es el tipo de letra utilizado en un documento.
Hay varias cosas a las que debemos prestar atención, como si el tipo de fuente que se aplica está de acuerdo con el diseño del sitio web, si el tipo de fuente que se aplica facilita a los visitantes la lectura del contenido del sitio web, si el tipo de fuente está de acuerdo con el tema o tema del sitio web o su contenido y si el color del texto aplicado es apropiado, con un fondo y no dificulta la lectura del texto para los visitantes, etc.
El propio HTML proporciona elementos, elementos específicos para regular la aplicación de fuentes y colores en documentos HTML. Hay muchos tipos de fuentes que podemos usar, pero también debemos recordar que las fuentes que se mostrarán en el navegador web provienen en su totalidad de la computadora del usuario. No importa si el navegador utilizado proviene de nuestro ordenador, pero si se abre en un navegador de otro ordenador, el diseño web que se ha diseñado puede volverse un caos porque el tipo de letra aplicado no está disponible en ese ordenador.
Es por eso que se utilizan fuentes estándar que generalmente están disponibles en Windows, Linux, Mac OS y otros. Las fuentes estándar generalmente son compatibles con la mayoría de los navegadores web, por lo que no tiene que preocuparse. Los siguientes tipos de fuentes estándar que puede utilizar:
1. Fuentes serif
Las fuentes Serif son fuentes que tienen un pie en cada letra, como Times New Roman y Georgian. Este tipo de fuente tiende a ser rápido y fácil de leer, por lo que generalmente se usa para medios de impresión en papel.
2. Fuentes monoespaciadas
Las fuentes monoespaciadas son fuentes con el mismo ancho que cada carácter, como Courier, Courier New y Andale Mono. Debido a su naturaleza, esta fuente generalmente se usa para escribir programas.
3. Fuentes Sans-Serif
Las fuentes sans-serif son fuentes que no tienen un pie en cada letra, como Arial, Verdana, Trebuchet MS, Helvetica y Calibri. Esta fuente se usa a menudo como un tipo de fuente en el sitio web.
4. Fuentes cursivas
Una fuente cursiva es un tipo de fuente que imita la caligrafía o la escritura a mano como Comic Sans. Esta fuente se usa generalmente para los aspectos menos formales de la escritura.
5. Fuentes de fantasía
La fuente de fantasía es un tipo de fuente visual con caracteres de fuente especiales, como fuente de matriz, disney y otros, y rara vez se usa para el texto de la página.
Para que pueda comprender mejor el material del color del texto y el tipo de fuente en HTML, veamos la explicación a continuación:
Fuentes de elementos
Con las etiquetas de fuente, puede ajustar o cambiar el color y el tamaño de un texto. También puede utilizar los elementos de fuente proporcionados por HTML.
El uso de este elemento está marcado con una etiqueta y termina con una etiqueta . El cambio de color y tamaño del texto se realiza utilizando los atributos que existen en los elementos de la fuente, a saber:
| Atributo | Función |
| Rostro | Indica el tipo de fuente utilizada en las páginas web. |
| Color | Indica el color del texto utilizado |
| Tamaño | Especifica el tamaño de un texto con un valor de 1 a 7 |
El siguiente es un ejemplo del código para usar la etiqueta de fuente en HTML:
<!DOCTYPE html> <html> <head> <title>Penggunaan Elemen Font</title> </head> <body> <p align="justify"><font face="Courier New" color="green" size="3">Claudio Andres Bravo Munoz menandatangani kontrak sebagai kiper FC Barcelona pada musim panas 2014 berasal dari Real Sociedad. Lahir pada 13 April 1983, di kota kecil Viluco de Buin, di daerah Santiago Cile. Ia mulai bermain sepak bola sejak kecil, walaupun awalnya bukanlah sebagai seorang kiper, sebaliknya ia bermain sebagai seorang striker dan kemudian menjadi pemain bertahan.</font></p> </body> </html>
Después de ejecutar el código anterior en el navegador, se verá como la imagen a continuación:
En su uso actual, la etiqueta solo es compatible con HTML 4.01, pero HTML5 no la admite o incluso la omite. Esto se debe a que el uso de etiquetas se puede reemplazar con CSS, donde las funciones CSS son superiores y eficientes que las etiquetas .
El siguiente es un ejemplo del uso de CSS en la configuración de fuentes en HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan CSS - FONT di HTML</title>
<style type="text/css">
#p{
color: #ff00ff;
font-size: 20px;
font-weight: bold;
font-family:Rockwell, Calibri, Monospace;
font-style : oblique; }
#p1{
color:#0000FF;
font-size: 1em;
font-weight: normal;
font-variant: small-caps;
font-family: Andale Mono;}
</style>
</head>
<body>
<p id="p">Contoh penggunaan CSS untuk mengatur font style pada suatu teks di HTML</p>
<p id="p1">Contoh Berikutnya Ini</h5>
</body>
</html>El resultado se verá como la imagen de abajo:
Después de ver el código CSS y la imagen que muestra en el navegador, por supuesto que tiene muchas preguntas sobre cuál es la función de las propiedades de la fuente en el código anterior. Aquí doy una pequeña explicación una por una (pero recuerda, todavía nos enfocamos primero en HTML, no en CSS):
A. Tamaño de fuente CSS
El tamaño de fuente se utiliza para determinar el tamaño de los caracteres de texto que se mostrarán. Por lo tanto, puede aplicar diferentes tamaños de fuente a cualquier texto en su documento HTML. Puede usar píxeles, em o % para determinar el tamaño de fuente como en el ejemplo del código anterior, a saber:
#p{ font-size: 20px; }
#p1{ font-size: 1em; }Se recomienda encarecidamente utilizar unidades em en lugar de píxeles, donde 1em equivale a 16 píxeles. Pero si te sientes más cómodo usando píxeles, también está bien. En el ejemplo #p1 { tamaño de fuente: 1em; }, el valor de píxel es 16 píxeles porque 16 píxeles / 16 = 1 em.
B. Familia de fuentes CSS
La familia de fuentes se utiliza para determinar el tipo de fuente que se aplica al documento HTML. Por ejemplo, mire el ejemplo del uso de la familia de fuentes en el código anterior, a saber:
#p{ font-family:Rockwell, Calibri, Monospace;}
#p1{ font-family: Andale Mono;}En #p, hay tres tipos de fuentes: Rockwell, Calibri y Monospace. Lo que significa que el primer tipo de fuente que se aplicará es Rockwell. Pero si la fuente Rockwell no está disponible en la computadora del usuario, el tipo de fuente que se aplicará es Calibri. Luego, si no está disponible, aplique Monospace, que es la fuente estándar.
C. Peso de la fuente CSS
El peso de la fuente se usa para imprimir letras en negrita, aquí hay un ejemplo en el código
previamente:
#p{ font-weight: bold;}
#p1{ font-weight: normal};D. Estilo de fuente CSS
Los estilos de fuente se usan para crear texto en cursiva donde puede usar 3 valores, a saber, normal, cursiva y oblicuo. El siguiente es un ejemplo del uso de estilos de fuente:
#p{ font-style : oblique;} // Teks ditampilkan berbentuk condong
#p1{ font-style : normal;} // Teks ditampilkan biasa tanpa style
#p2(font-style : italic;} // Teks ditampilkan dalam huruf miringE. Variante de fuente CSS
La fuente variante se utiliza para imprimir texto en todas las letras mayúsculas. He aquí un ejemplo de su uso:
#p{ font-variant: normal;} // Teks normal
#p1{ font-variant: small-caps ;} // Teks ditampilkan dalam huruf kapital semuaDespués de leer el artículo anterior, espero que pueda cambiar el color y el tipo de fuente en su documento HTML. El siguiente tutorial de HTML trata sobre cómo crear una cita en HTML usando la etiqueta q y la cita en bloque.
