Cómo hacer un cuadro con el texto dentro de HTML

El Lenguaje de Marcas de Hipertexto (HTML) es el lenguaje más utilizado para crear la estructura y el contenido de páginas web. HTML contiene una amplia gama de elementos que permiten a los usuarios generar enlaces, imágenes, párrafos, encabezados y mucho más. Estos elementos se agregan a una página mediante el uso de conjuntos específicos de caracteres, conocidos como etiquetas. Una vez que comprendes la combinación de elementos y etiquetas requeridos, crear un bloque de texto rodeado por un cuadro en HTML es una tarea rápida.

Paso 1

Abre la página web que quieres editar y visualiza su código HTML. Si usas un editor de texto, simplemente abre tu página en el programa y desplázate hacia abajo hasta llegar a la sección de la página donde aparecerán el cuadro y el texto. Si usas un programa visual de sitios web, como Microsoft Expression Web o Adobe Dreamweaver, abre tu página y luego haz clic en el área donde quieres agregar el cuadro y el texto. Después de hacerlo, cambia tu modo de visualización a "Vista de código" para ver el HTML que controla el comportamiento de la página.

Paso 2

Presiona la tecla "Enter" para crear una línea en blanco en tu código HTML.

Paso 3

Copia y pega las siguientes tres líneas de código en la línea en blanco creada en el paso anterior:

<div style="width:500px; border:2px solid black; padding:10px">
  Un bloque de texto de párrafo va aquí
</div>

Paso 4

Ajusta los parámetros del código que agregaste en el paso anterior, según sea necesario. Cambia el ancho, tamaño del borde, estilo del borde y color del borde modificando los valores "500px", "2px", "solid" y "black" en la primera línea del código. Cambia la cantidad de espacio alrededor del texto modificando el valor "10px" en la segunda línea del código. Modifica el texto ubicado entre las etiquetas de apertura "<div>" y cierre "</div>" para adaptarlo a las necesidades de tu página.

Paso 5

Guarda la página y luego ábrela en un navegador web. El código que insertaste y modificaste en los dos pasos anteriores agrega un cuadro de 500 píxeles de ancho con un borde negro, rodeando un bloque de texto de párrafo.