Entradas

Mostrando entradas de septiembre, 2023

Más cosas sobre div

 Contenedor Genérico: <div> se utiliza para agrupar otros elementos HTML, como párrafos, encabezados, imágenes, formularios u otros elementos, para aplicar estilos y manipular su presentación. No tiene significado semántico: A diferencia de etiquetas como <p> (párrafo), <h1> (encabezado de nivel 1) o <form> (formulario), <div> no tiene un significado semántico específico. Su función principal es proporcionar una estructura y organización al contenido. Estilo y Diseño: Los <div> se utilizan en conjunto con CSS para controlar la apariencia de las secciones de una página web. Puedes aplicar colores de fondo, márgenes, bordes, dimensiones y otras propiedades de estilo a través de CSS. Anidamiento: Puedes anidar múltiples <div> dentro de otros para crear una estructura jerárquica y organizar el contenido de manera más compleja. Volver a Eqtiquetas y selectores

Color de un elemento. background-color.

Ejemplo de Background Color Mi Elemento con Fondo de Color Este es un ejemplo de un elemento con un fondo de color azul. <!DOCTYPE html> <html lang="es"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Ejemplo de Background Color</title>     <style>         /* Estilo CSS para el elemento con fondo de color */         .mi-elemento {             width: 300px;             height: 200px;             background-color: #3498db; /* Color de fondo azul */             color: #fff; /* Color del texto en blanco */             text-align: center;             padding:...

Ejemplo 24

Ejemplo de Background Color Mi Elemento con Fondo de Color Este es un ejemplo de un elemento con un fondo de color azul.

Separación entre caracteres: letter-spacing.

 <!DOCTYPE html> <html> <head>     <title>Ejemplo de letter-spacing</title>     <style>         /* Estilo para el párrafo con letter-spacing */         .texto-con-espaciado {             letter-spacing: 4px; /* Ajusta el valor según tus preferencias */         }         /* Estilo adicional para resaltar el texto original */         .texto-original {             color: red;         }     </style> </head> <body>     <p class="texto-original">Este es un ejemplo de texto con letter-spacing.</p>     <p class="texto-con-espaciado">Este es un ejemplo de texto con letter-spacing.</p> </body> </html> El ejemplo 23 , muestra la página. Para aprender sobre el color de un element...

Ejemplo 23

Ejemplo de letter-spacing Este es un ejemplo de texto con letter-spacing. Este es un ejemplo de texto con letter-spacing.

Ejemplo 22

Ejemplo de Line-Height Este es un párrafo de texto con line-height por defecto. El valor de la altura de línea es el normal del navegador. Este es un párrafo de texto con line-height personalizado. La altura de línea es ajustada a 1.5 veces el tamaño de la fuente. Este es otro párrafo de texto con line-height por defecto. La altura de línea sigue siendo la predeterminada.Holaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

Medida de separación entre las líneas de un párrafo: line-height

Establece la altura de línea entre líneas de texto. Un ejemplo para este estilo es: <!DOCTYPE html> <html> <head> <style>     /* Estilo personalizado para el párrafo con line-height */     .texto-con-line-height {         line-height: 1.5; /* Aquí puedes ajustar el valor según tus preferencias */     }       .texto-con-line-height-2{         line-height: 10           ; /* Aquí puedes ajustar el valor según tus preferencias */     } </style> </head> <body> <h1>Ejemplo de Line-Height</h1> <p>Este es un párrafo de texto con line-height por defecto. El valor de la altura de línea es el normal del navegador.</p> <p class="texto-con-line-height">Este es un párrafo de texto con line-height personalizado. La altura de línea es ajustada a 1.5 veces el tamaño de la fuente.</p>    <p class=...

Ejemplo 21

Ejemplo de Decoración de Texto Este es un párrafo de texto sin decoración. Este es un párrafo de texto con subrayado. Este es un párrafo de texto con línea superior. Este es un párrafo de texto con línea a través. Este es un párrafo de texto con subrayado y línea superior. Este es un párrafo de texto con subrayado y línea a través. Este es un párrafo de texto que hereda la decoración de su elemento padre. Este es un párrafo de texto con decoración inicial. Este es un párrafo de texto con color de decoración azul. Este es un párrafo de texto con estilo de decoración ondulado.

Valores de text-decoration

text-decoration: none;: Este valor elimina toda la decoración del texto. Los enlaces se ven como texto normal sin subrayado ni línea a través. text-decoration: underline;: Agrega una línea de subrayado debajo del texto. Este es el valor predeterminado para la mayoría de los enlaces. text-decoration: overline;: Agrega una línea de subrayado por encima del texto. text-decoration: line-through;: Agrega una línea horizontal que atraviesa el medio del texto, como si se estuviera tachando. text-decoration: underline overline;: Puedes combinar múltiples valores para aplicar subrayado y línea superior al mismo tiempo. text-decoration: underline line-through;: Combina subrayado y línea a través. text-decoration: inherit;: Hereda la propiedad de decoración del texto de su elemento padre. text-decoration: initial;: Establece la propiedad en su valor inicial predeterminado. text-decoration-color: Esta propiedad permite especificar el color de la decoración del texto, como el color del subrayado o ...

Ejemplo 20

Ejemplo de Texto Subrayado Este es un párrafo de texto normal. Este es un texto subrayado utilizando la propiedad CSS text-decoration .

Decoración de texto: text-decoration

Controla la decoración del texto (por ejemplo, "underline" para subrayado). Un ejemplo de código para text-decoration es: <!DOCTYPE html> <html> <head> <style>     /* Definir una clase CSS que aplica subrayado al texto */     .subrayado {         text-decoration: underline;     } </style> </head> <body> <h1>Ejemplo de Texto Subrayado</h1> <p>Este es un párrafo de texto normal.</p> <p>Este es un <span class="subrayado">texto subrayado</span> utilizando la propiedad CSS <code>text-decoration</code>.</p> </body> </html> El ejemplo 20 muestra la página resultante. Para ver el despliegue de text-decoration, haz clic aquí . Para aprender como establecer altura entre líneas de un texto, haz clic aquí . Volver a  Catálogo de estilos .

Ejemplo 19

Ejemplo de text-align Texto centrado Este texto está alineado a la izquierda. Este texto está alineado a la derecha. Este es un ejemplo de texto justificado. El texto se extiende hacia los márgenes izquierdo y derecho.

Alineación de texto: text-align

Establece la alineación del texto (izquierda, derecha, centro, justificado). Un ejemplo para text-align es <!DOCTYPE html> <html> <head>     <title>Ejemplo de text-align</title>     <style>         /* Alinea el texto al centro */         .centro {             text-align: center;         }         /* Alinea el texto a la izquierda */         .izquierda {             text-align: left;         }         /* Alinea el texto a la derecha */         .derecha {             text-align: right;         }         /* Justifica el texto (rellena el espacio en cada línea) */         .justificado {           ...

Ejemplo 18

Este texto está en negrita. Este texto está en su grosor normal.

Negrita: font-weight

Controla el grosor o peso de la fuente (por ejemplo, "bold" para negrita). Un ejemplo de código para font-weight. <!DOCTYPE html> <html> <head>     <style>         /* Estilo para el texto con font-weight */         .texto-negrita {             font-weight: bold; /* Establece el grosor de la fuente en negrita */         }         /* Estilo para el texto normal */         .texto-normal {             font-weight: normal; /* Restablece el grosor de la fuente a su valor normal */         }     </style> </head> <body>     <p class="texto-negrita">Este texto está en negrita.</p>     <p class="texto-normal">Este texto está en su grosor normal.</p> </body> </html> El ejemplo 18 da cómo se ve la página ...

Creador de QR

Generador de Código QR Generador de Código QR Ingresa una URL: Generar Código QR

Ejemplo 17

Este es un párrafo de ejemplo con Arial.

Estructura para los estilos

Para definir un estilo, la estructura es: estilo: tipo de estilo 1, tipo de estilo 2; Ejemplo: font-family: Arial, sans-serif; Hay que recalcar que al ser aplicado a texto debe estar dentro de llaves, precedidas por el selector p, así: p {             font-family: Arial, sans-serif;         } Lo cual a su vez debe estar dentro de <style>: <style>         /* Definimos un estilo CSS para el párrafo */         p {             font-family: Arial, sans-serif;         }     </style> y lo cual, a su vez, debe estar dentro de <head>: <head>     <title>Ejemplo de font-family en HTML</title>     <style>         /* Definimos un estilo CSS para el párrafo */         p {             font-family: Arial, sans...

La etiqueta "style"

La etiqueta <style> en HTML se utiliza para definir estilos CSS (Cascading Style Sheets) directamente en el documento HTML. Esto permite aplicar estilos a elementos HTML específicos sin necesidad de hojas de estilo externas. Aquí tienes una explicación detallada de cómo funciona la etiqueta <style>: Ubicación en el Documento HTML: La etiqueta <style> se coloca generalmente dentro del elemento <head> del documento HTML, entre las etiquetas <head> y </head>. Aquí es donde se definen los estilos que se aplicarán a la página. <head>     <style>         /* Definición de estilos CSS aquí */     </style> </head> Definición de Estilos CSS: Dentro de la etiqueta <style>, puedes escribir reglas de estilo CSS para aplicar a los elementos HTML en el cuerpo de la página. Las reglas de estilo constan de un selector (que indica qué elementos se verán afectados) y un conjunto de propiedades y valo...

La etiqueta "head".

La etiqueta <head> en HTML se utiliza para incluir metadatos e información esencial sobre el documento HTML. Aunque no se muestra en la parte visible de la página web que los usuarios ven en el navegador, desempeña un papel fundamental en la configuración y la descripción del documento web. El el marco de la creación de estilos para texto en HTML, la etiqueta <head> no es un contenedor de estilos en sí, pero se utiliza para incluir enlaces a hojas de estilo CSS externas y definir estilos en línea que afectarán la apariencia de la página web. La etiqueta <head> es un lugar común donde se gestionan los estilos, ya que aloja elementos relacionados con la presentación y el diseño de la página. Para aprender sobre como generar estilos de texto, haz clic aquí . Volver a  Información preliminar .

font-family

Define la familia de fuentes a utilizar para el texto. Un ejemplo de código para font-family es el siguiente: <!DOCTYPE html> <html> <head>     <style>         /* Definimos un estilo CSS para el párrafo */         p {             font-family: Arial, sans-serif;         }     </style> </head> <body>     <p>Este es un párrafo de ejemplo con Arial.</p> </body> </html> La página correspondiente está en en el ejemplo 17 . En este ejemplo: Usamos la etiqueta <style> en el <head> del documento HTML para definir un estilo CSS interno. Dentro del estilo CSS, seleccionamos todos los párrafos (p) y establecemos la propiedad font-family para cambiar la fuente del texto a "Arial" o, si no está disponible, a cualquier fuente sans-serif genérica. Cuando abras este código en un navegador web, verás que el te...

Catálogo de estilos

Propiedades de texto y fuente: font-family : Define la familia de fuentes a utilizar para el texto. font-weight : Controla el grosor o peso de la fuente (por ejemplo, "bold" para negrita). text-align : Establece la alineación del texto (izquierda, derecha, centro, justificado). text-decoration : Controla la decoración del texto (por ejemplo, "underline" para subrayado). line-height : Establece la altura de línea entre líneas de texto. letter-spacing : Controla el espaciado entre caracteres. Propiedades de color y fondo: background-color: Establece el color de fondo de un elemento. background-image: Permite añadir una imagen de fondo. color: Define el color del texto. border: Controla los bordes alrededor de un elemento. Propiedades de diseño y disposición: margin: Establece los márgenes alrededor de un elemento. padding: Define el espacio de relleno entre el contenido y el borde de un elemento. width y height: Controlan el ancho y la altura de un elemento. display: ...

Comentarios en html

En HTML, puedes escribir comentarios para documentar y anotar tu código utilizando la siguiente sintaxis: <!-- Tu comentario aquí --> Los comentarios HTML son ignorados por los navegadores web y no se muestran en la página web resultante. Su único propósito es proporcionar información a los desarrolladores y mantenedores del código, lo que facilita la comprensión del propósito y la estructura del HTML. Volver a Programación de texto

Selector de Elemento

Para aplicar estilos a texto específico en tu página web, primero necesitas seleccionar el elemento HTML que contiene ese texto. Se puede hacer utilizando el selector de elemento. Por ejemplo, si deseas aplicar estilos a todos los párrafos en tu página, puedes usar el selector de elemento "p".  Ejemplo: p {     /* Estilos aquí */ } o es el selector de texto y hacer referencia a todo lo que sea texto. Las llaves {} encierran los estilos a aplicar al texto y en la página resultante se mostrará el texto con los estilos dentro de las llaves. En realidad se puede usar cualquier selector de texto en vez de p, como h1 a h6. La selección de estilos no se muestran en la página web, solo el texto con los estilos aplicados, de modo que los selectores de elementos van dentro de la etiqueta <head>. Para ver la estructura para definir estilos, haz clic aquí . Volver a Información preliminar .

Información preliminar

La etiqueta <head> La etiqueta <style> Selector de Elemento Estructura para los estilos Catálogo de estilos Volver a Avanzado

Estilo de texto

Información preliminar Volver a Avanzado

CSS

CSS, o Cascading Style Sheets (Hojas de Estilo en Cascada), es un lenguaje de marcado utilizado para describir la presentación y el formato de un documento HTML (Hypertext Markup Language) en una página web. En otras palabras, CSS se utiliza para definir cómo se debe mostrar y diseñar el contenido HTML en un navegador web. Aquí hay algunas características clave de CSS: Separación de contenido y presentación: CSS permite separar el contenido (texto, imágenes, estructura) de la presentación (colores, fuentes, diseño) en una página web. Esto hace que el código HTML sea más limpio y facilita la administración y el mantenimiento del diseño. Estilo en cascada: El término "en cascada" se refiere a la prioridad y la jerarquía que sigue CSS al aplicar estilos a elementos HTML. Los estilos pueden definirse en múltiples lugares, como archivos externos de CSS, en el mismo documento HTML o en línea dentro de etiquetas HTML. El navegador aplica los estilos siguiendo un orden de cascada, lo...

Avanzado

Estilo de texto Volver a  Programación de texto .

Servidor

Welcome to nginx! If you see this page, the nginx web server is successfully installed and working. Further configuration is required. For online documentation and support please refer to  nginx.org . Commercial support is available at  nginx.com . Thank you for using nginx. http://localhost/

Código de programación

Se utiliza para resaltar y mostrar código de programación dentro del texto, generalmente en una fuente de monoespacio. La etiqueta es <code>. Un ejemplo para este código de programación es <html> <body> <p>Para imprimir un mensaje en Python, usa <code>print("Hola, mundo")</code>.</p> </body> </html> La página resultante para el código es el ejemplo 16 . Volver a  Intermedio .

Ejemplo 16

Para imprimir un mensaje en Python, usa print("Hola, mundo") .

Ejemplo 15

Este es un párrafo. Este es otro párrafo.

Separador de contenido

Se utiliza para crear una línea horizontal o un separador en el contenido. Puede ser útil para dividir secciones en una página. La etiqueta para el separador de contenido es <hr>. En el código se coloca entre los contenidos a separar. Un ejemplo para este código es: <html> <body> <p>Este es un párrafo.</p> <hr> <p>Este es otro párrafo.</p> </body> </html> La página resultante para este código es el ejemplo 15 . Para aprender acolocar código se programación en tu página, sin que este código afecte tu código html en el que haz hecho dicha página, haz clic aquí . Volver a  Intermedio .

Ejemplo 14

ONU es una organización internacional.

Abreviaturas

Se utiliza para marcar abreviaturas o acrónimos en el texto y proporcionar una descripción completa cuando el usuario pasa el cursor sobre ellas. La etiqueta para abreviaturas es  </abbr>. Viene acompañada de <p>. La sintaxis es:  <p><abbr title="Texto en cursor">Texto mostrado 1</abbr> Texto mostrado 2 (es opcional poner).</p> "Texto en cursor" es un texto que se muestra cuando el cursor se posa sobre "Texto mostrado 1". El "Texto mostrado 2" puede o no ponerse. Un ejemplo de código para esto es: <html> <body> <p><abbr title="Organización de las Naciones Unidas">ONU</abbr> es una organización internacional.</p> </body> </html> El ejemplo 14 muestra la página en generada. Para aprender generar una línea horizontal o separador de contenido, haz clic aquí . Volver a  Intermedio .

Ejemplo 13

El libro La Odisea es una obra clásica.

Cita de referencia

La etiqueta <cite> se utiliza para indicar que un texto es una referencia o cita a una obra, como un libro, artículo o película. Viene acompañada de la etiqueta <p>. La estructura es: <p>El libro <cite>La Odisea</cite> es una obra clásica.</p> Un ejemplo de código para cita de referencia es: <html> <body> <p>El libro <cite>La Odisea</cite> es una obra clásica.</p> </body> </html> El ejemplo 13 proporciona la página resultante. Para aprender a introducir abreviaturas en textos, haz clic aquí . Volver a  Intermedio .

Ejemplo 12

Esto es una cita en bloque. Puede ser un párrafo largo o múltiples párrafos.

Cita en bloque

Se utiliza para resaltar citas largas de texto que se deben mostrar en un bloque separado con un margen. La etiqueta para crear una cita en bloque la etiqueta es  <blockquote>. Un ejemplo de código para cita en bloque es <html> <body> <blockquote>     Esto es una cita en bloque. Puede ser un párrafo largo o múltiples párrafos. </blockquote> </body> </html> La página generada para este código es el ejemplo 12 Volver a Intermedio .

Contenedor de texto en línea

En HTML, un "contenedor de texto en línea" es un elemento que se utiliza para agrupar y aplicar estilos a partes específicas del texto dentro de una línea o párrafo de texto sin cambiar la estructura del propio párrafo. Los contenedores de texto en línea se utilizan para aplicar estilos o comportamientos a fragmentos de texto dentro de un párrafo, sin afectar a todo el párrafo en su conjunto. Volver a  Información general .

Intermedio

Cita en bloque Citas de referencia Abreviaturas Código de programación Volver a Programación de texto .

Ejemplo 11

H 2 O

Básico

Campo de marcado Cuerpo textual Título y párrafo Links en textos Grosor de textos (Negrita) Texto en cursiva Texto subrayado Saltos de línea Texto en superíndice Texto en subíndice Volver a  Programación de texto .

Texto en subíndice

Para colocar texto en subíndice, la etiqueta es <sub> y viene acompañada de <p> por que es un texto el que se colocará en subíndice. La sintaxis para el subíndice es: <p>Base<sub>subíndice</sub></p>. Un ejemplo de código para el subíndice es: <!DOCTYPE html> <html> <body> <p>H<sub>2</sub>O</p> </body> </html> La página originada por este código es el ejemplo 11 . Volver a  Básico .

Ejemplo 10

Base Exponente

Texto en superíndice

 Para colocar un superíndice en un texto la etiqueta es <sup> el cual viene acompañado con <p>, ya que el superíndice es texto. La sintaxis es: <p>Texto<sup>texto en superíndice</sup></p>. Un ejemplo de código de texto en superíndice es  <!DOCTYPE html> <html> <body> <p>Base<sup>Exponente</sup></p> </body> </html> La página originada por este código es el ejemplo 10 . Para aprender a colocar texto en subíndice, haz clic aquí . Volver a  Básico .

Ejemplo 9

Este es un texto con un salto de línea.

Saltos de línea

Para hacer un salto de línea sin tener que hacer otro párrafo, la etiqueta correspondiente es <br> y también viene acompañado por la etiqueta <p> por cuanto es un texto al que se va a hacer saltar de línea. La sintaxis es: <p>Este es un texto con<br>un salto de línea.</p>. Un ejemplo de código para el salto de línea es: <!DOCTYPE html> <html> <body> <p>Este es un texto con<br>un salto de línea.</p> </body> </html> La página correspondiente es el ejemplo 9 . Para aprender a colocar texto en superíndice, haz clic aquí . Volver a  Básico .

Ejemplo 8

Este es un texto subrayado .

Texto subrayado

El texto subrayado viene soportado por la etiqueta <u> y de la misma manera viene acompañado por <p>. La sintaxis para el código es <p>Texto<u>texto subrayado</u>.</p>. Un código de ejemplo para el subrayado es algo como esto: <!DOCTYPE html> <html> <body> <p>Este es un <u>texto subrayado</u>.</p> </body> </html> La página resultante para este código viene dada en el ejemplo 8 . Para aprender a hacer saltos de línea sin hacer otro párrafo haz clic aquí . Volver a  Básico .

Ejemplo 7

Este es un texto en cursiva .

Texto en cursiva

La etiqueta para colocar un texto en cursiva es <em>. Debe venir acompañado de <p> por cuanto es un texto el que se va a colocar en cursiva. La sintaxis es: <p>Texto <em>texto en cursiva</em>.</p> Un ejemplo de código para cursiva es <!DOCTYPE html> <html> <body> <p>Este es un <em>texto en cursiva</em>.</p> </body> </html> La página relacionada a este código es la del ejemplo 7 . Para aprender a escribir texto en subrayado haz clic aquí . Volver a  Básico .

Ejemplo 6

Este es un texto en negrita .

Grosor de texto (Negrita)

La etiqueta para el grosor de textos es <strong> y la sintaxis es como sigue: <p>Texto <strong>texto en negrita</strong>.</p>. Notemos como debemos usar la etiqueta <p> y esto es debido a que es un texto al que vamos a negrear. Un ejemplo de código para negrear texto es: <!DOCTYPE html> <html> <body> <p>Este es un <strong>texto en negrita</strong>.</p> </body> </html> La página resultante del código está en el ejemplo 6 . Volver a  Básico . Para aprender a colocar texto en cursiva, haz clic aquí .

Ejemplo 5

Ejemplo.com

Links en textos

Para direccionar a una página web usamos la etiqueta <a>, pero para esto, debemos completarla con href como sigue en el siguiente ejemplo:  <!DOCTYPE html> <html> <body>     <a href="https://www.ejemplo.com">Ejemplo.com</a> </body> </html> En este caso tenemos una página que abre https://www.ejemplo.com en la misma página. Aquí el ejemplo 4 . Para que la pagina abra en una pestaña diferente el código seria algo como esto: <!DOCTYPE html> <html> <body>     <a href="https://www.ejemplo.com" target="_blank">Ejemplo.com</a> </body> </html> Aquí la página generada en el ejemplo 5 . En este ejemplo, el atributo target="_blank" en la etiqueta <a> asegura que el enlace se abra en una nueva pestaña o ventana del navegador cuando los usuarios hagan clic en él. Notemos que la sintaxis para esto es   <a href="URL" target="_blank">palabras...

Ejemplo 4

Ejemplo.com

Ejemplo 3

Ecuaciones Ecuaciones de segundo grado. Las ecuaciones de segundo grado son una forma de ecuaciones polinomiales.

Título y párrafo

Ya vimos que para introducir títulos son las etiquetas del <h1> al <h6>. Ahora, para introducir párrafos la etiqueta es <p>. Si quisiéramos que nuestra página tuviera el título "Ecuaciones", el subtitulo "Ecuaciones de segundo grado" y como párrafo tuviera "Las ecuaciones de segundo grado son una forma de ecuaciones polinomiales", el código estaría dado por: Ejemplo 3 : < !DOCTYPE html> <html> <body> <h1> Ecuaciones</h1> <h2>Ecuaciones de segundo grado</h2> <p> Las ecuaciones de segundo grado son una forma de ecuaciones polinomiales</p> </body> <html> La página asociada a este código es esta . Para aprender a incrustar direcciones de páginas web haz clic aquí . Volver a  Básico .

Ejemplo 2

Título de importancia 1 Título de importancia 2 Título de importancia 3 Título de importancia 4 Título de importancia 5 Título de importancia 6

Cuerpo textual

Cuerpo textual <body>: Contiene el contenido visible de la página web, como texto, imágenes y otros elementos. <h1>, <h2>, <h3>, ... <h6>: Encabezados de diferentes niveles, utilizados para estructurar el contenido en secciones y subsecciones. <p>: Crea párrafos de texto. <a>: Crea enlaces a otras páginas web o recursos. Ya vimos que la estructura mínima válida en código html es: <!DOCTYPE html> <html>  </html> Pero esto da lugar a una página sin contenido. Para dárselo necesitamos la etiqueta <body> que es la etiqueta que muestra el contenido visible de la página web. De modo que la estructura debe quedar así: <!DOCTYPE html> <html> <body> </body> </html> Pero esto segurá dando lugar a una página web sin contenido, ya que <body> solo da la orden de mostrar lo que tiene en su contenido y que hasta ahora no le hemos dado. Cuando escribimos un texto con la intensión de que sea leído,...

Ejemplo 1

Campo de marcado

Todo documento html debe comenzar con  <!DOCTYPE html> para indicar que se está trabajando con  HTML5. Además, como mínimo debe tener las etiquetas  <html>  y  </html>  para abrir y cerrar el campo de marcado (el espacio donde se escribe el código html). De modo que la estructura más básica para escribir el código es: Ejemplo 1 <!DOCTYPE html> <html>  </html> En este caso dará lugar a una página sin contenido pero con la estructura mínima necesaria válida. Aquí la página resultante. Ahora, para continuar, necesitamos darle contenido a la página. Para aprender a darle contenido textual a la página, haz clic, aquí . Volver a Básico .

Programación de texto

Programación de texto Comentarios en html Básico Intermedio Avanzado Volver a  INDICE

Etiquetas y selectores

Etiqueta Una etiqueta es una construcción especial que se utiliza para definir y marcar elementos específicos en un documento. Las etiquetas son parte fundamental de la sintaxis de HTML y se utilizan para indicar al navegador web cómo debe interpretarse y mostrarse el contenido en una página web. Cada etiqueta está compuesta por corchetes angulares < y > y dentro tienen a un elemento que se llama "selector". Las etiquetas son denotadas por estos corchetes que encierran un conjunto de caracteres (palabras o nombres específicos, en fin alfanuméricos) que indican qué tipo de elemento o estructura se está utilizando en el documento web. Por ejemplo, una etiqueta clásica es <p> que denota la apertura de un párrafo y </p> es la etiqueta de cierre que indica el final del párrafo. <p>Este es un párrafo de ejemplo.</p> HTML se basa en un sistema de etiquetas o "marcado" que se insertan en un documento de texto para definir la estructura y el...

Metadatos

Metadatos Un metadato es una pieza de información que describe o proporciona datos acerca de otros datos. En otras palabras, son datos que proporcionan contexto o información adicional sobre un conjunto de datos o un elemento específico. Los metadatos son fundamentales para organizar, buscar y comprender la información en diversos contextos, como en bases de datos, sistemas de gestión de contenido, bibliotecas digitales y más. Volver a  Información general .

HTML

HTML HTML, que significa "HyperText Markup Language" (Lenguaje de Marcado de Hipertexto, en español), es un lenguaje de marcado utilizado para crear y estructurar el contenido de una página web. Volver a  Información general .

Hipertexto

Hipertexto Un hipertexto es un tipo de texto que contiene enlaces o vínculos a otros documentos, páginas web o recursos relacionados, lo que permite a los usuarios navegar y acceder a información adicional de manera no lineal. En otras palabras, el hipertexto es un sistema de escritura o presentación que integra referencias a otros contenidos, lo que brinda la posibilidad de explorar información de manera interconectada. El término "hipertexto" se compone de dos partes: "Hipér" proviene del griego "hyper," que significa "sobre" o "más allá." "Texto" se refiere al contenido escrito o a la información textual. En conjunto, "hipertexto" se refiere a un tipo de texto que va más allá del formato de texto tradicional, ya que incluye enlaces o referencias que permiten a los lectores saltar de una parte del texto a otra o acceder a recursos adicionales en línea. El hipertexto es fundamental en la estructura de la World Wide ...

Lenguaje de marcado

Definición 1: Lenguaje de marcado. Un lenguaje de marcado es un sistema de notación que se utiliza para etiquetar y estructurar el contenido de un documento de texto, con el fin de indicar cómo debe ser presentado o procesado. En lugar de ser un lenguaje de programación en sí mismo, como C++, Java o Python, un lenguaje de marcado se enfoca en describir la apariencia y la estructura del contenido, separando la presentación del contenido real. Volver a Información general .

Información general

1. Lenguaje de marcado 2. Hipertexto 3. HTML 4. Metadatos 5. Etiqueta 6. Contenedor de texto en línea 7. CSS Volver a INDICE

INDICE

INDICE GENERAL Información general Programación de texto