Cómo insertar una línea vertical con KompoZer

HTML, los propietarios de sitios lenguaje utilizar para crear páginas Web, no tiene herramientas de dibujo. Si los diseñadores Web desean crear gráficos tales como círculos o líneas, deben utilizar lenguajes de script para llevar a cabo esa tarea. Si su página necesita una línea vertical, se puede utilizar un simple truco CSS para convertir un elemento de regla horizontal en una línea que se mueve de arriba a abajo en su página Web.

Instrucciones

1

Lanzamiento KompoZer y pulse la tecla "Ctrl" y "N." Se abre el "Crear un nuevo documento" ventana. Haga clic en "Crear un documento XHTML," y luego haga clic en "Crear".

2

Haga clic en el botón "Fuente" en el fondo de KompoZer. Aparece el código para un documento HTML vacía. Pega el siguiente código HTML en "<body>" sección del documento:

<Clase hr = "línea" />

Esto crea un elemento de regla horizontal que hace referencia a una clase CSS llamado "línea". Reglas horizontales crean líneas que corren de izquierda a derecha a través de una página Web.

3

Copie el texto siguiente y pégalo en la sección del documento "<head>":

<Style type = "text / css">

.line {position: absolute; top: 100px; left: 200px; altura: 300px; width: 2px;

</ Style>

Esta clase CSS llamado "línea" define características de visualización de la regla horizontal. Al establecer el valor de la anchura de 2 píxeles, se fuerza navegadores para crear una línea vertical. Los valores de la parte superior y el ancho determinan dónde aparece la línea vertical en la página Web. El atributo de altura fija la altura de la línea.

4

Pulse la tecla "Ctrl" y "S" para abrir el "Guardar página como" ventana. Introduzca un nombre para el archivo HTML en el cuadro de texto "Nombre de archivo" y haga clic en "Guardar" para guardar el documento en su disco duro.

5

Abra el documento en su navegador. Verá una línea vertical colocada en la ubicación definida por los valores de los atributos superiores e izquierdas definidas en la clase CSS.

Consejos y advertencias

  • Pruebe diferentes valores para los valores superior e izquierda en la "línea" definición de la clase CSS. Cambiar estos valores le permite colocar la línea en cualquier parte de la página Web. Para hacer las líneas más largas, aumente el valor de la altura. Disminuya el valor para crear líneas más cortas.