Hay diferentes estilos de formato que podemos usar en nuestro sitio web. Algunos de ellos son cursivas, audaces, subrayados, Strikethrough, subíndice y más. Estos estilos de formato se implementan de acuerdo con los requisitos. Con la ayuda de estos estilos de formato, uno puede tener un documento más claro y claro para leer.
Este manual proporcionará una guía sobre:
Antes de apresurarnos a la sección CSS, veamos cómo HTML nos proporciona las etiquetas para subíndices y superíndices.
¿Qué es html "" Elemento?
El html "El elemento se utiliza para hacer de un texto dentro de él un SuperScript. El superíndice se muestra como un texto pequeño ligeramente por encima de la línea normal.
Cómo formatear el texto como superíndice en CSS?
En HTML, primero, agregue un nuevo elemento Div con el "fórmula" clase. Luego añade
Se incluyen elementos para especificar la fórmula. El texto que debe agregarse como superíndice se coloca dentro del ""Iniciar etiqueta y""End Tag de la siguiente manera:
Expresión algebraica
a2 - b 2 = (a + b) (a - b)
(A+B)2 = A2 + 2AB +B2
Estilo "Fórmula" Div
.Fórmula
Ancho: 80%;
Altura: 200px;
Color de fondo: #153462;
Color: Ghostwhite;
borde: 2px sólido RGB (44, 37, 37);
Shadow de caja: 1PX 1PX 5PX 4PX RGB (135, 130, 130);
relleno: 1px 20px;
margen: auto;
Font-Family: cursiva;
El ".fórmula"Se utiliza para acceder a la fórmula de la clase Div y aplicar las propiedades CSS alistadas:
Elemento de estilo "P"
.Fórmula P
tamaño de fuente: 20px;
El tamaño de fuente del
elemento del div "fórmula"Se aplica con la propiedad"tamaño de fuente".
El código proporcionado anteriormente generará salida como se muestra en la imagen a continuación:
Hasta ahora, hemos discutido cómo hacer un texto superíndice en HTML, y ahora, la próxima sección demostrará cómo hacer texto de subíndice con un ejemplo práctico.
¿Qué es html "" Elemento?
El html "El elemento se utiliza para formatear el texto como subíndice. El subíndice se muestra como texto pequeño, ligeramente debajo de la línea normal.
Cómo formatear el texto como subíndice en CSS?
Aquí hay un código HTML que usa el HTML ""Elemento dentro del" registro aM = log an entonces m = n registro a[m * n] = log aM + log anorte Producción ¿Qué es la propiedad CSS "alineada vertical"?? El CSS "alinear verticalLa propiedad se utiliza para establecer la alineación de la vertical del elemento. Los siguientes son los valores asociados con esta propiedad: Para hacer el subíndice o superíndice de texto, el "sub" y "súperSe utilizan los valores. Cómo formatear el texto con CSS? En html, primero, agregue un nuevo nombre de elemento divir con el "expresión" clase. Entonces, coloque dos elementos para especificar la fórmula que contiene un texto de subíndice y superíndice. La etiqueta que tiene diferentes ID se utilizan alrededor del texto para formatearse. Los elementos con ID "abajo"Están formateados como subíndices y los elementos que tienen ID"arriba"Están formateados como superíndices: logid = "abajo"> a[m * n] = log id = "abajo"> am + log id = "abajo"> anorte (a+b) id = "arriba"> 2 = ayuda = "arriba"> 2 + 2ab +bid = "arriba"> 2 Estilo "Expresión" Div Las siguientes son las propiedades que se aplican en el "expresión"Div: ID de estilo "abajo" El "#abajo"Señala el elemento con la identificación"abajo". Está diseñado con la propiedad "alinear vertical"Con el valor establecido como"sub". Estilo ID de estilo "arriba" El "#arriba"Se utiliza para acceder al elemento con la identificación"arriba". Las propiedades aplicadas a esta ID se enumeran a continuación: Producción Estas son las formas de superíndice y texto de subíndice en CSS. Conclusión Al diseñar cualquier aplicación, los desarrolladores deben tener en cuenta los estilos de formato de texto. Podemos hacer subíndices y superíndices utilizando el HTML "" y ""Etiquetas, respectivamente. En CSS, la propiedad vertical-align se utiliza para este propósito. Este artículo ha demostrado cómo subíndice y superíndice en HTML y CSS con la ayuda de un ejemplo práctico. Fórmulas de logaritmo
.expresión
Ancho: 80%;
Altura: 200px;
Margen: 1px Auto;
relleno: 1px 10px;
Color de fondo: RGB (243, 218, 75);
Border: 2px Solid Goldenrod;
tamaño de fuente: 18px;
#abajo
Align vertical: sub;#arriba
Align vertical: super;
tamaño de fuente: pequeño;