Cómo crear una página web enmarcada
El editor no sabía cómo encuadrar páginas web antes, pero necesitaba hacer una prueba hace algún tiempo. Encontré un problema al enmarcar páginas web, así que fui a aprender sobre ello. A continuación, el editor utilizará los siguientes ejemplos para enseñarle cómo crear una página web enmarcada. Espero que te ayude.
Aprendamos hoy del siguiente ejemplo.
Cree una página web de marco de directorio y guarde este archivo como page2.html según sea necesario.
Requisitos: Crear una tabla con 4 filas y 1 columna (300 píxeles de alto y 100 píxeles de ancho) en la página web del marco del directorio La tabla está centrada, con un borde amarillo y un fondo verde; en la tabla está en cursiva china, 14 puntos, negrita, negro; alinee horizontalmente el contenido de la celda hacia la derecha y alinee verticalmente hacia abajo en la página web del marco principal e inserte la imagen 8139.jpg en el paquete de material. configure "Introducción a los alimentos" y el paquete de materiales Enlace al archivo sc7.htm en el contenido, configure "Noticias relacionadas" para vincularlo al sitio web.cn, configure "Imágenes relacionadas" para vincularlo al archivo bg7.jpg en el paquete de material, configure "Network Expert" para que se vincule a la dirección de correo electrónico alguien@microsoft.com
Paso uno: crear una nueva página web
Primero abrimos el software y seleccionamos "Modificar" - "Conjunto de cuadros" - "Dividir en cuadros izquierdo y derecho" debajo de la barra de menú. Guarde tres páginas web.
1. La página web del marco completo.
Seleccione la línea vertical en el medio del marco. Cuando veamos "lt;framesetcols="597, 598"gt;" en la columna de código, significa que hemos seleccionado correctamente.
2. El lado izquierdo de la página web del marco
Seleccione el área en blanco izquierda
3.
Seleccione el área en blanco a la derecha
Como se muestra en la imagen:
Paso 2: cree la página web del marco a la izquierda
Primero inserte la tabla y establezca las propiedades básicas
1. Seleccione "Insertar" - "Tabla" en el menú principal como se muestra en la figura.
2. Luego configure las propiedades de la tabla
(La tabla con 4 filas y 1 columna tiene "300 píxeles de alto y 100 píxeles de ancho", el borde de la tabla es amarillo y el El fondo es verde.) Entre ellos, la altura y el color del borde se ingresan mediante un código. Como se muestra en la imagen:
3. En cuanto al fondo y centrado, podemos ir al diseño de página del panel de propiedades para diseñarlo. Como se muestra en la imagen:
Paso 3: Establezca el estilo CSS
1. Primero abra el panel CSS, seleccione el signo " " debajo del panel y el efecto que se muestra en el. Aparecerá la siguiente figura.
2. Establece el estilo. Seleccione el tipo "id", asígnele el nombre "stlye1" y guarde "Sólo este documento". Como se muestra en la figura:
3. Establezca los atributos de estilo. "Escritura china regular, 14 puntos, negrita, negro." Como se muestra en la imagen:
Paso 4: Usar estilo css
1. Escribe el texto correspondiente en la tabla. Como se muestra en la imagen:
2. Selecciona todo el texto y ve al panel de propiedades. Seleccione "Clase" - "stlye1" y configuraremos el estilo CSS. Como se muestra en la imagen:
Paso 5: Establece la posición del texto.
Selecciona el texto, ve al panel de propiedades y configura las propiedades "horizontal" y "vertical". Como se muestra en la imagen:
Paso 6: Establecer enlaces de texto.
Selecciona "Introducción de comida", ve al panel de propiedades, selecciona "Enlace" e ingresa la dirección a la que queremos vincularnos. Luego simplemente seleccione otro texto en secuencia. El efecto es el siguiente:
(Nota: los archivos de la página web y los archivos de imagen que seleccionamos anteriormente se pueden completar directamente. Para la URL, debemos agregar "http://" al frente y la dirección de correo electrónico debe agregarse "mailto :")
Paso 7: Configure la página web correcta
Seleccione la página web correcta, seleccione "Insertar" - "Imagen", Seleccionamos la imagen que queremos insertar y listo.
Como se muestra en la imagen:
En este punto podemos abrir el archivo htm y explorar el efecto en el navegador, como se muestra en la imagen: