CSS | propiedad border: Aquí, vamos a aprender acerca de la propiedad frontera en CSS con ejemplos .
propiedades de fuente CSS
propiedades de fuente en CSS se utiliza para definir el tipo de letra familia , osadía , tamaño , y el estilo de de un texto.
Sintaxis: propiedad
Element {
font: [font-style] [font-variant] [font-weight] [font-size/line-height] [font-family];
}
font-style
La propiedad font-style en CSS se utiliza para definir el estilo de la fuente utilizada class el texto.
En general, hay tres tipos:
- cursiva
- oblicua
- normal
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<style>
p.p1 {
font-style: normal;
}
p.p2 {
font-style: italic;
}
p.p3 {
font-style: oblique;
}
</style>
</head>
<body>
<p class="p1">Hello! Welcome to Include Help.</p>
<p class="p2">Hello! Welcome to Include Help.</p>
<p class="p3">Hello! Welcome to Include Help.</p>
</body>
propiedad de salida
tamaño de fuente
La propiedad font-size se da en % , px , em , o cualquier otra medida CSS válido. El uso de píxeles, puede utilizar la herramienta de zoom para cambiar el tamaño de la página entera.
Ejemplo:
<!DOCTYPE html>
<head>
<style>
h3 {
font-size: 40px;
}
</style>
</head>
<html>
<body>
<h3>Hello! Welcome to include Help.</h3>
</body>
</html>
salida
El interior de texto & lt; h3 & gt; será 40px de tamaño.
propiedad font-family
Esta es for definir el nombre de la familia.
Puede comenzar con la fuente que desea, y terminar con una familia genérica si no hay otras fuentes están disponibles, el navegador recoge una fuente similar en la familia genérica.
Ejemplo:
<!DOCTYPE html>
<head>
<style>
p {
font-weight: bold;
font-size: 20px;
font-family: Arial, sans-serif;
}
</style>
</head>
<html>
<body>
<p>Hello! Welcome to include Help</p>
</body>
</html>
salida
propiedad de fuente-variante
propiedad de fuente-variante en la CSS se utiliza para establecer la variante del texto normal o small-caps.
Ejemplo:
<!DOCTYPE html>
<head>
<style>
.element-one {
font-variant: normal;
}
</style>
</head>
<html>
<body>
<p class="element-one">Hello! Welcome to include Help.</p>
</body>
</html>
salida
La fuente taquigrafía
Usted puede tener todos sus estilos de fuente en un solo elemento con el abreviada fuente. Sólo tiene que utilizar la propiedad de fuente, y poner los valores en el orden correcto.
Sintaxis:
element
{
font: [font-style] [font-variant] [font-weight] [font-size/line-height] [font-family];
}
Ejemplo:
p {
font-weight: bold;
font-size: 20px;
font-family: Arial, sans-serif;
}
Sin embargo, con la fuente de taquigrafía que se puede condensar como sigue,
<!DOCTYPE html>
<head>
<style>
p {
font: bold 20px Arial, sans-serif;
}
</style>
</head>
<html>
<body>
<p>Hello! Welcome to include Help.</p>
</body>
</html>
salida