CSS Plus Sign
Ejemplo 01:
Comencemos con el primer ejemplo de usar el signo más dentro del código HTML para usarlo de muchas maneras. Echamos un vistazo a la etiqueta del cuerpo del código HTML. Dentro del cuerpo de la página HTML, tenemos un título de tamaño 1 que establece que usamos el signo más a través del estilo CSS para las principales historias que se lanzarán. Usamos otro encabezado de tamaño 2, que es el segundo tamaño más grande de los encabezados HTML seguido de la etiqueta Div. Esta etiqueta "div" crea una nueva sección que contiene información sobre la fecha de lanzamiento y el lugar donde se lanza.
Después de esta etiqueta, tenemos otra etiqueta "div" que se usa para la creación de una nueva sección en la página HTML. La sección del cuerpo de este HTML se completa aquí. Echemos un vistazo a la etiqueta "estilo" de una página HTML para echar un vistazo al estilo de los diferentes elementos. Dentro de esta etiqueta, utilizamos el signo más "+" entre el encabezado 2 y la etiqueta "div" para aplicar el estilo en el elemento "div" adyacente al encabezado 2. El tamaño de la fuente es de 22 píxeles, el peso de la fuente es más claro, la pantalla está en línea, mientras que el color de fondo para la sección "div" es morado y el color de texto es ligero cian. Después de esto, usamos el título de encabezado H1 para peinarlo con el color de texto cercano a negro. El estilo se completa aquí.
La salida de este código se muestra en la siguiente imagen. El primer encabezado de tamaño 1 es de color azul oscuro de color, mientras que el otro rumbo del segundo tamaño más grande se muestra en un color negro azabache. Dado que la primera etiqueta DIV está adyacente al encabezado 2 de una página HTML, se diseña de acuerdo con las propiedades utilizadas para los elementos combinados "Div" y "H2". Por otro lado, el encabezado 1 tiene el estilo de acuerdo con el uso del H1 dentro de la etiqueta de estilo.
Ejemplo 02:
Comencemos con otro ejemplo de usar el signo más al estilo. Comenzamos este ejemplo con el uso de la etiqueta principal DOCTYPE HTML seguida de la apertura única de la etiqueta de cabeza. Sigue la apertura de la etiqueta de título que contiene el título "CSS Plus Sign" dentro de ella y el cierre de la etiqueta del título.
Echemos un vistazo al área del cuerpo de un código HTML usando la etiqueta del elemento del cuerpo. Usamos los diferentes encabezados y párrafos a través de sus etiquetas particulares, yo.mi. "H1, H2 y P". Primero, usamos el encabezado H1 del tamaño más grande. Después de eso, usamos el encabezado 2 del segundo tamaño más grande junto con el párrafo adyacente. Creamos una nueva etiqueta DIV después del encabezado para crear una nueva sección dentro de la página HTML. Por último, usamos el encabezado 2 nuevamente seguido del elemento de párrafo dentro de la sección Div.
Usando el signo más entre el encabezado 2 y el párrafo, diseñamos el párrafo adyacente al encabezado 2. Tenemos más de un encabezado del mismo tamaño. Por lo tanto, se necesitan el encabezado 2 que viene primero desde el comienzo de la etiqueta del cuerpo. Utilizamos el color verde en el párrafo adyacente a este primer encabezado 2 con el tamaño de fuente de 28 píxeles, khaki de color de fondo y la propiedad de transformación de texto para mostrar el texto en mayúsculas.
Después de esto, usamos la etiqueta del párrafo para diseñar los párrafos restantes de nuestra página HTML coloreándola con rosa de té con el peso de la fuente en negrita y la familia de fuentes de fantasía. Se trata del uso del signo más para el estilo. Ejecutemos este código ahora.
Obtenemos la salida con los encabezados de los tamaños 1 y 2 sin ningún estilo. El primer párrafo se muestra en todas las palabras mayúsculas con el fondo de fondo y el texto de color verde. Mientras que el último párrafo se muestra por separado en texto de color púrpura. El uso del signo más para diseñar el párrafo no afecta el estilo del segundo párrafo.
Ejemplo 03:
El cuerpo comienza con el elemento del encabezado 1 seguido del elemento div para crear una nueva sección. Esta sección contiene un total de cuatro elementos de párrafos para crear los diferentes párrafos y una sección DIV que también usa la etiqueta de párrafo para crear un solo párrafo dentro de esta sección.
Después de que se completen todos los elementos internos de esta sección, cerramos la sección del Div exterior junto con el cierre de la sección del cuerpo. Dentro de la etiqueta de estilo, usamos el párrafo "P" para aplicar el peso de la fuente como audaz y el tamaño de fuente de 25 píxeles a todos los párrafos del cuerpo. Ahora, usamos el signo más dentro de las dos etiquetas de párrafo para aplicar el estilo especificado en el párrafo adyacente del primer párrafo en la sección del cuerpo. Se establecen diferentes propiedades relacionadas con la fuente, el borde y el texto para el segundo párrafo, yo.mi. 5px de doble borde.
Ahora, usamos las etiquetas de párrafo nuevamente con el signo más para diseñar los párrafos adyacentes del tercer y cuarto del área del cuerpo. Se establecen las diferentes propiedades de estilo de fuente junto con el color del borde y la propiedad del contorno del borde, yo.mi. Se especifica el borde de 5 píxeles punteado y el color de texto carmesí para los párrafos adyacentes. Ahora, el código se completa y nos dirigimos a ejecutarlo.
La salida muestra que el segundo párrafo tiene un estilo de manera bastante diferente al resto de los párrafos, mientras que los párrafos tercero y cuarto tienen un estilo de manera similar. El primer y quinto párrafo se ve similar en el estilo.
Conclusión
Este artículo demuestra algunos ejemplos simples para ilustrar el uso del signo "+" más dentro de la secuencia de comandos HTML. Aprendimos cómo el signo "+" más puede diseñar algunos elementos mencionados después del signo "+" más dentro del estilo CSS sin cambiar el estilo del primer elemento especificado del HTML. Para este propósito, utilizamos un total de 3 ejemplos para diseñar los párrafos y las secciones DIV. Usando este elemento de atributo, puede hacer cambios en cualquier página HTML sin temor a perder el formato para su página HTML.