1. Defina el sitio
1. Cree una carpeta en cualquier directorio raíz (asumimos que aquí es la unidad E), por ejemplo, asígnele el nombre MyWeb.
***Nota: Todos los archivos utilizados en el sitio web deben tener nombres en inglés.
2. Abra Dreamweaver, seleccione "Sitio - Nuevo sitio" para abrir el cuadro de diálogo. Ingrese el nombre del sitio web en Nombre del sitio (el chino está disponible) y seleccione la carpeta que acaba de crear (E:web) en la carpeta raíz local. Luego confirma.
***Nota: Cuando abra Dreamweaver nuevamente, encontrará automáticamente el sitio que acaba de crear. Si hay varios sitios, puede seleccionarlos en el menú "Sitio - Abrir sitio".
2. Cree una página
1. En el espacio en blanco debajo de la carpeta local E:MyWeb, haga clic derecho y seleccione "Nuevo archivo" para crear una página. El nombre de archivo predeterminado es untitled.htm. htm significa que este archivo de página web es un archivo HTML estático. Cambie el nombre a index.htm.
***El nombre de la primera página del sitio web suele ser index.htm o index.html. Puedes elegir los nombres de otras páginas tú mismo.
2. Haga doble clic en index.htm para ingresar al estado de edición de la página. Ingrese el nombre de la página web en el cuadro de título, haga clic derecho y seleccione Propiedades de la página para abrir la ventana "Propiedades de la página". Aquí puede configurar el título, el color de fondo o la imagen posterior del sitio web y el color del hipervínculo (normalmente el predeterminado es suficiente) y mantener todo lo demás como predeterminado.
3． En este momento, el cursor está en la esquina superior izquierda y puede ingresar una oración, como "Bienvenido a mi página de inicio". Seleccione el texto, use el menú "Ventana/Propiedades" para abrir el panel de propiedades, seleccione el tamaño del texto como 6, luego centre el texto y luego use algunos retornos de carro delante del texto para colocarlo en el medio del página.
4. Para seleccionar una fuente, seleccione el último elemento en Fuente: Editar lista de fuentes. Luego seleccione el signo + en el cuadro de diálogo, luego seleccione una fuente que deba agregarse a la lista de fuentes en la columna "Fuentes disponibles" y haga clic en el botón en el medio para agregarla.
***Los caracteres chinos más utilizados en las páginas web son las fuentes Song. No agregue fuentes especiales a la lista para usar, porque otros no podrán verlas si no están instaladas en sus computadoras. Si necesita usarlo, conviértalo en una imagen antes de usarlo.
***La forma de ingresar espacios en una página web es ajustar el método de entrada al ancho completo.
***La forma de ajustar líneas en una página web es: Mayús+Entrar. Simplemente presione Enter para cambiar los párrafos.
3. Agregue imágenes a la página
1. En el espacio en blanco debajo de la carpeta local E:MyWeb, haga clic derecho y seleccione "Nueva carpeta". Esto crea una carpeta y la usa para colocar imágenes. Puede cambiarle el nombre a tu o pic. o Las imágenes están bien.
2. Utilice el menú "Ventana/Objeto" para abrir el panel de objetos, haga clic en "Insertar imagen" y seleccione la imagen que desea insertar en el cuadro de diálogo. Si aparece un cuadro de diálogo: "¿Le gustaría copiar este archivo a la carpeta raíz?", debe seleccionar "Sí" y luego guardarlo en la carpeta que acaba de crear.
3. Seleccione la imagen y abra el panel de propiedades, donde puede nombrar la imagen, restablecer el alto y el ancho de la imagen y arrastrar los puntos en las esquinas de la imagen para cambiar el tamaño. Mantenga presionada la tecla Mayús y arrastre los puntos de las esquinas para estirar la imagen manteniendo la relación de aspecto. Para restaurar el tamaño original, haga clic en el botón "Cambiar tamaño" en la esquina inferior derecha.
4. "Enlace" puede ingresar directamente la dirección aquí. "Reemplazo" es la descripción de la imagen, es decir, el texto que se muestra cuando el mouse apunta a la imagen; "Borde" es el ancho del borde de la imagen y "Alineación" es el método de alineación.
4. Agregue un hipervínculo
1. Agregue un enlace al texto.
Por ejemplo, ingrese "Mi artículo" en la página, luego selecciónela, abra el panel de propiedades y en el cuadro "Enlace", seleccione la página a la que desea vincular. En el siguiente cuadro de "destino", generalmente usamos self para abrir una nueva ventana en lugar de la ventana abierta actualmente o seleccionamos en blanco para abrir una nueva ventana;
2. Agregue un enlace a la imagen de la misma manera que el enlace al texto de arriba. Inserte la imagen y luego selecciónela en el cuadro de enlace en el panel de propiedades.
**** Las imágenes pueden crear diferentes enlaces múltiples. He aquí cómo:
Hay algunos gráficos debajo del elemento "Mapa" en el panel de propiedades. Por ejemplo, haga clic en el cuadrado, el cursor cambia a una cruz y dibuja una zona activa rectangular azul en la imagen. En este momento, puede configurar el enlace. dirección para esta zona activa en el panel de propiedades, se mostrará el puntero del mouse. De manera similar, al configurar un punto activo usando un círculo, puede configurar otros enlaces para la imagen.
3. Agregue un enlace de correo electrónico. Seleccione el texto o la imagen al que desea agregar un enlace de correo electrónico, abra el panel de propiedades e ingrese la dirección de correo electrónico en el cuadro "Enlace". El formato es el siguiente: mailto: dirección de correo electrónico. Tenga en cuenta que no hay espacios intermedios.
4. Si el enlace es a un archivo que el navegador no puede abrir, como exe, Zip, etc., cuando el espectador haga clic en el enlace, se realizará la función de descarga del archivo o reproducción en línea.
5. Uso de tablas
1. Haga clic en Insertar/Tabla para abrir el panel de tablas para la configuración. El número de filas, columnas, ancho, bordes, etc., "relleno de celda" es la distancia entre el interior de la celda y el contenido; "espacio entre celdas" es la distancia entre celdas y la unidad es píxeles.
2. Después de insertar la tabla, haga clic en el borde de la tabla para seleccionar la tabla completa. Luego puede realizar varias configuraciones en el panel de propiedades a continuación.
3. Mueva el cursor a una de las celdas y el panel de propiedades que ve ahora es el panel de propiedades de la celda. También puede realizar varias operaciones en las celdas. Como color de fondo, imagen de fondo, borde, fusión, división, etc.
6. Otras operaciones sobre mesas
- Principio de realización de mesas de líneas finas:
1. Seleccione toda la tabla y establezca su fondo en negro (este color es el color de las líneas de la tabla).
2. Seleccione todas las celdas y establezca su fondo en blanco.
2. Formatear tablas automáticamente 1. Primero cree una tabla y luego selecciónela.
2. Seleccione Comando/Formato de tabla en el menú. Es decir, puedes elegir algunos estilos de tabla preestablecidos.
Sany Pixel Divider 1. Inserte una tabla con 1 fila y 1 columna, un ancho de 200 píxeles y un borde y margen de 0.
2. Seleccione la tabla, establezca la altura de la tabla en 1 píxel y establezca un color de fondo (es decir, el color de línea deseado).
3. Cambie a la ventana de código y diseño y elimine el código.
7. Utilice tablas para crear una página completa
: la parte superior de la página web (que generalmente incluye iconos, anuncios y menús de navegación).
1. Cree una tabla con 1 fila y 2 columnas, un ancho de 760 píxeles y un borde y margen de 0.
2. Seleccione la tabla, establezca la disposición en alineación central y el color de fondo en #3366CC.
3. Coloque el cursor en la celda izquierda, establezca su disposición horizontal en alineación izquierda y su disposición vertical en alineación superior y luego inserte una imagen. Generalmente, el ícono del sitio web, es decir, el logotipo, se inserta aquí.
4. Coloque el cursor en la celda de la derecha, establezca su ancho en 500, alinee la disposición horizontal con el centro y la disposición vertical con el medio, y luego inserte una imagen, generalmente un anuncio de una página web, es decir, un bandera.
5. Coloque el cursor después de la tabla que acaba de completar y haga clic en Insertar/Tabla para crear una tabla con 1 fila y 1 columna, un ancho de 760 píxeles y un borde y margen de 0.
6. Seleccione la tabla que acaba de crear, establezca la disposición en alineación central y el color de fondo en #005173.
7. Inserte varias imágenes en la tabla, una tras otra, como menús de la barra de navegación.
2. La parte central de la página web (lista de columnas a la izquierda, noticias del sitio web en el medio, lista de columnas a la derecha)
1. Después de la tabla de la barra de navegación, haga clic en Insertar/Tabla para crear una tabla con 1 fila y 3 columnas, un ancho de 760 píxeles y un borde y margen de 0. Y configure el modo de disposición en alineación central y el color de fondo en #FFFFFFFF.
2. Coloque el cursor en la celda izquierda, establezca su ancho en 18%, alinéelo horizontalmente con el centro y verticalmente con la parte superior, luego inserte una imagen y una barra de navegación.
3. Coloque el cursor después de la imagen que acaba de insertar, haga clic en Insertar/Tabla e inserte una tabla con 12 filas y 1 columna y un ancho del 90%. Establezca el espacio entre celdas en 1 y el color de fondo en #CCCCCC.
4. Coloque el cursor en la primera celda de la tabla, establezca su altura en 20 y su color de fondo en #FFFFFF. Insertar/Imagen, inserta un pequeño punto delante del texto de navegación. Configure las otras 11 celdas de manera similar, de modo que se complete la lista de clasificación de columnas de la izquierda.
5. Coloque el cursor en la celda central de la tabla principal, establezca su ancho en 66%, alinéelo horizontalmente con el centro y alinéelo verticalmente con la parte superior, luego inserte /image para insertar una barra de navegación.
6. Coloque el cursor después de la imagen, haga clic en Insertar/Tabla e inserte una tabla con 4 filas y 1 columna y un ancho del 95%. Establezca el espacio entre celdas en 1 y el color de fondo en #CCCCCC.
7. Coloque el cursor en la primera celda de la tabla, arrastre el mouse para seleccionar las 4 celdas, establezca la altura en 60 y el color de fondo en #FFFFFF.
8. Coloque el cursor en la celda en el lado derecho de la tabla principal, establezca su ancho en 16%, alinéelo horizontalmente con el centro y alinéelo verticalmente con la parte superior, use Insertar/Imagen e inserte una barra de navegación.
9. Coloque el cursor después de la imagen, haga clic en Insertar/Tabla e inserte una tabla con 7 filas y 1 columna y un ancho del 90%. Establezca su espaciado en 1 y su color de fondo en #CCCCCC.
10. Mantenga presionada la tecla Ctrl, use el mouse para hacer clic en las celdas 1, 3, 5 y 7 de la tabla que acaba de insertar y luego establezca su altura en 55 y su color de fondo en #FFFFFF.
11. Seleccione las celdas 2, 4 y 6, establezca su altura en 6 y su color de fondo en #FFFFFF.
12. Cambie a la ventana del código fuente y elimine los símbolos de espacio " " en las celdas 2, 4 y 6.
La parte inferior de tres páginas web (que generalmente incluyen información de derechos de autor y otro contenido relacionado)
1. Coloque el cursor en la tabla principal y haga clic en Insertar/Tabla para crear una tabla con 2 filas y 2 columnas, un ancho de 760 píxeles y un borde y margen de 0.
2. Seleccione la tabla, establezca la disposición en alineación central y el color de fondo en #3366CC.
3. Coloque el cursor en la celda izquierda de la fila 1 de la tabla, establezca su ancho en 50%, la disposición horizontal en la configuración predeterminada, la disposición vertical en la línea de base, el color de fondo en #FFFFFF y luego ingrese la información de derechos de autor. El color del contenido puede ser. lo que quieras.
4. Coloque el cursor en la celda derecha de la fila 1 de la tabla, haga clic en Insertar/Imagen, inserte una imagen redondeada, ingrese la palabra Correo electrónico después y establezca su tamaño y color en 1 y #FFFFFF.
5. Insertar/Objeto de formulario/Campo de texto, inserte un campo de texto, el ancho puede ser arbitrario.
6. Insertar/Imagen, inserta una imagen GO.
7. Establezca las propiedades de la página. Haga clic en el menú Editar/Propiedades de página, ingrese un título en la columna Título, seleccione la imagen de fondo y establezca el borde superior en 0.
*** Poner toda la página web en diferentes partes y combinarlas en diferentes tablas también puede acelerar el tiempo que tarda el navegador en leer la página. ; debido a que el navegador muestra el contenido después de leer la tabla completa, es mejor no encuadrar toda la tabla.
8. Utilice la tabla de diseño para crear una página completa
. 1. Haga clic en Insertar/Diseño y el botón de vista de diseño que se encuentra dentro cambiará al estado de vista de diseño (el valor predeterminado es la vista estándar). También puede usar Ver/Vista de tabla/Vista de diseño en el menú para ingresar.
2. Primero haga clic en el botón Dibujar tabla de diseño y luego cree una tabla de diseño en la página como si fuera un dibujo.
3. Al igual que en el ejemplo anterior, dibuje la tabla grande en la parte superior, luego en el medio y luego en la parte inferior de la página web.
4. Haga clic nuevamente en el botón Dibujar celda de diseño y luego dibuje la celda de diseño en la tabla de diseño ya dibujada.
5. Regrese a la vista estándar, inserte pequeñas tablas anidadas en las tablas divididas, refine la página y complete el diseño de toda la página.
**** Tenga cuidado de colocar toda la página en una tabla de diseño grande, porque la velocidad de navegación de dicha página web será muy lenta. Se deben dividir varias tablas de diseño según el diseño y el contenido de la página, y luego se deben insertar celdas de diseño en ellas.
9. Uso de capas
1. Haga clic en Insertar/Capa. También puede hacer clic en el icono y arrastrar el mouse para crear una capa.
3. Seleccione la capa creada y mire el panel de propiedades. Simplemente utilice el "Número de capa" y la "Etiqueta" predeterminados. El "número de capa" es necesario para la programación, pero generalmente no lo usamos ahora. "Superior" es la distancia desde el borde superior de la página; "Izquierda" es la distancia desde el borde izquierdo. El "eje z" es el orden de las capas, con los números más grandes apilados encima de los números más pequeños.
****Si no se establece ningún color, la capa es transparente.
4. Haga clic en el cuadro pequeño en la esquina superior izquierda de la capa intermedia para arrastrar la capa y también se podrá ajustar el tamaño.
5. En la columna "desbordamiento", cuando el texto excede el tamaño de la capa, visible (la parte sobrante aún se muestra), oculto (la parte sobrante está oculta), desplazamiento (la barra de desplazamiento se muestra independientemente de si está excedido), auto (hay La barra de desplazamiento solo aparece cuando se excede).
6. Haga clic en el menú Ventana/Otros/Capa y aparecerá la ventana de administración de capas. Allí puede modificar el nombre de la capa y el valor del eje Z, o hacer clic en el icono del ojo para hacer la capa visible o invisible. También existe una opción para evitar la superposición.
7. Alineación de capas. Mantenga presionada la tecla Mayús y seleccione varias capas al mismo tiempo. Luego use Modificar/Alinear, usando las opciones aquí.
8. Capa de anidación. ⑴Primero inserte una capa en el documento. ⑵ Coloque el cursor dentro de la capa y luego continúe insertando una capa para obtener una capa anidada. ⑶El interior se llama capa secundaria y el exterior es la capa principal. Su orden en el eje Z es el mismo. Cuando arrastra la capa principal, las capas secundarias también se moverán entre sí. Cuando mueves una capa secundaria, la capa principal no se mueve con ella.
10. Comprender la línea de tiempo
1. Haga clic en Insertar/Capa en el menú para insertar una capa.
2. Inserte una imagen en la capa, como la imagen de un avión. (La imagen aquí también puede ser una pequeña imagen .gif animada)
3. Haga clic en Ventana/Otros/Línea de tiempo en el menú para abrir la ventana Línea de tiempo.
4. Seleccione la capa creada en la página, presione y mantenga presionado el ícono de cuadro pequeño en la esquina superior izquierda de la capa con el mouse y arrastre la capa al primer cuadro de la línea de tiempo. En este momento, se crea automáticamente una línea de tiempo con una longitud de 15 fotogramas.
5. Seleccione el fotograma 1 en la línea de tiempo, arrastre la capa de la página hasta la esquina superior izquierda de la página, donde comienza la animación.
6. Seleccione el fotograma 15 en la línea de tiempo y arrastre el fotograma hasta cualquier longitud, como 30 fotogramas.
7. Seleccione el fotograma número 30 y arrastre la capa hacia la parte inferior derecha de la página. En este momento, la ventana muestra la trayectoria de movimiento de la capa desde el fotograma 1 hasta el fotograma 30. (El movimiento es una línea recta en este momento)
8. Puede hacer clic en el cuadro 15, hacer clic derecho y seleccionar "Agregar fotograma clave". Con el cuadro 15 seleccionado, arrastre la capa a la parte media e inferior de la página.
9. Marque el elemento "Reproducción automática".
11. Haga un tablero de anuncios rodante
1. Inserte una capa en la página y luego establezca un fondo para la capa como marco del tablero de anuncios.
2. Luego inserte una capa anidada en la capa creada y mueva la capa anidada debajo de la capa principal.
3. Ingrese texto en la capa anidada y céntrelo.
4. Abra el panel Línea de tiempo y agregue la subcapa como un objeto al panel.
5. Cree un camino hacia arriba para la capa secundaria y muévala sobre la capa principal.
6. Arrastre el último fotograma clave para aumentar el tiempo de animación y luego marque "Reproducción automática" y "Bucle".
7. Seleccione la capa principal y establezca la propiedad "desbordamiento" en "oculta" en su panel de propiedades.
12. Utilice animación flash en la página
1. Haga clic en el botón Flash en Insertar para insertar una animación en la página. También puede seleccionar el menú Insertar/Medios/Flash para completar este paso.
2. Seleccione la animación insertada y mire el panel de propiedades. Aquí puede establecer su ancho y alto, o cambiar el tamaño arrastrándolo.
3. Puedes hacer clic en "Reproducir" aquí para obtener una vista previa de la animación.
13. Haga transparente la animación flash insertada
1. Cuando ya hay un fondo en la página web, o desea insertar una animación flash en una imagen, y la animación flash en sí también tiene un color de fondo, por lo que afectará la apariencia , entonces necesitamos convertirla en una animación transparente.
2. Por ejemplo, inserte una imagen en la página.
3. Inserte una capa en la imagen e inserte la animación flash requerida en la capa.
4. Seleccione la animación flash y haga clic en el botón "Parámetros" en el panel de propiedades.
5. Ingrese "wmode" en el cuadro izquierdo de "Parámetros". Ingrese "transparente" en el cuadro "Valor" a la derecha.
14. Reproducir sonido en la página
1. Después de completar toda la página, si desea agregar música de fondo a la página, tenga en cuenta que la música de fondo suele ser un archivo *.midi. Dichos archivos de sonido son muy pequeños y fáciles de descargar. rápidamente Otros formatos no son adecuados como música de fondo.
2. Además de todas las tablas de la página, (tenga en cuenta que en este momento solo se muestra este elemento en la barra de selección de etiquetas en la parte inferior izquierda de la ventana de edición, o haga clic en la esquina inferior izquierda para asegurarse de que se agregue este comportamiento a toda la página). Haga clic en el botón "+" en la ventana de comportamiento (o use el menú Ventana/Comportamiento para abrir la ventana de comportamiento).
3. Seleccione "Reproducir sonido" en el menú emergente. Abre un cuadro de diálogo.
4. Utilice "Examinar" en este cuadro de diálogo para seleccionar el sonido que desea reproducir y confirmar.
5. En este momento, el panel de comportamiento muestra automáticamente el evento como en carga y la acción como reproducción de sonido. Haga clic en esta fila y aparecerá un botón en el medio. Haga clic en el botón para configurar el evento bajo el cual se reproducirá este sonido. Puede elegir "Mostrar eventos"/"IE5.0.
6. Comúnmente usamos Onload (cuando la página está cargada), OnClick (haga clic con el mouse), OnMouseOver (mueva el mouse sobre el objeto), OnUnload (cuando la página está cerrada), etc.
7. Este comportamiento también se puede establecer en imágenes y enlaces de texto. Antes de reproducir el sonido en el enlace de texto, primero agregue un enlace vacío al texto, es decir, seleccione el texto e ingrese un símbolo "#" en el cuadro de enlace.
15. Ventana emergente
1. Primero cree una página (como a.htm) para que se muestre en una ventana pequeña. Dado que la ventana emergente no puede ser demasiado grande, el contenido debe ser menor.
2. Abra una página creada, mueva el cursor fuera de todas mis tablas en la página, haga clic en el botón "+" en la ventana de comportamiento y seleccione "Abrir ventana del navegador" en el menú emergente.
3. Ingrese la configuración correspondiente en el cuadro de diálogo. La URL que se mostrará es a.htm. El ancho y el alto de la ventana los determina usted mismo, en píxeles. Verifique todos los parámetros en las propiedades según sea necesario.
4. Después de completar la configuración, haga clic en "Aceptar". En este momento, el comportamiento de abrir la ventana de navegación se mostrará en la ventana de comportamiento. La condición de activación es Onload. Si esto no es necesario, configúrelo usted mismo.
5. Este comportamiento también se puede establecer en imágenes y enlaces de texto. .
6. Puede utilizar este método para expresar la bienvenida al visitante al abrir, el anuncio del sitio web, la despedida al salir, etc.
16. Información de la barra de estado de control
1. Abra la página y seleccione una imagen.
2. Haga clic en el botón "+" en la ventana de comportamiento y seleccione Establecer texto/Establecer texto de la barra de estado.
3. En la columna "Mensaje" del cuadro de diálogo, ingrese las palabras que deben mostrarse, como una introducción a esta imagen.
4. Puede establecer la condición de activación del comportamiento en OnMouseOver (el mouse se mueve sobre el objeto), de modo que cuando el mouse pase sobre esta imagen, aparecerá información relevante en la barra de estado.
5. Si necesita que este mensaje desaparezca después de quitar el mouse, use este comportamiento nuevamente, no escriba nada en la columna "Mensaje" y luego cambie la condición de activación a OnMouseOut (mouse quitado).
6. Este comportamiento también se puede establecer en un fragmento de texto. O puede configurarlo en toda la página.
17. Información emergente
1. Abra una página creada y haga clic en el elemento en la esquina inferior izquierda. Haga clic en el botón "+" en la ventana de comportamiento y seleccione el elemento "Información emergente" en el menú emergente.
2. Ingrese el mensaje que desea mostrar en la columna "Mensaje" en la ventana de configuración.
3. Si la condición de activación se establece en Onload (cuando se carga la página), se puede utilizar como mensaje de bienvenida para abrir la página. Si se establece en OnUnload (cuando la página está cerrada), se puede utilizar como mensaje de despedida cuando el usuario cierra la página.
4. También puede configurar un mensaje emergente en un determinado párrafo de texto. Por ejemplo, si no desea que otros copien un fragmento de texto, seleccione el texto completo. Tenga en cuenta que <P> se muestra en la esquina inferior izquierda, que es un párrafo.
5. Luego haga lo mismo e ingrese declaraciones como derechos de autor en el mensaje. Simplemente establezca la condición de activación en OnBeforeCopy (que se activa cuando se presiona el botón derecho) o OnCopy (que se activa cuando se presiona el botón derecho para copiar).
18. Botón de imagen dinámica
1. Prepare dos imágenes del mismo tamaño. El método común es utilizar una como fotografía en escala de grises y otra como fotografía en color. O uno con botones cóncavos y otro con botones elevados.
2. Ejemplo: inserte una tabla con 3 filas y 1 columna y establezca el ancho en 180 píxeles.
3. Coloque el cursor en la primera línea e inserte una imagen en escala de grises.
4. Ingrese la dirección que se vinculará en la columna "Enlace" en el panel de propiedades y agregue un nombre a la imagen, como tu1.
5. Haga clic en el botón "+" en la ventana de comportamiento y seleccione "Cambiar imagen" en el menú emergente.
6. En este momento, la imagen que se va a intercambiar se muestra en la columna "Imagen" y luego la imagen intercambiada se selecciona en la columna "El archivo original del templo es".
7. Hay dos parámetros a continuación, "Precargar imagen" y "Restaurar imagen cuando el mouse se desliza", los cuales deben seleccionarse.
8. Cree otros dos botones dinámicos de la misma manera.
19. Diseñe las páginas con marcos.
Los marcos constan de dos partes principales: conjuntos de marcos y marcos individuales.
1. Haga clic en el marco insertado para mostrar los 13 estilos de marco definidos. Tomemos como ejemplo la estructura superior-media-inferior.
2. Haga clic en el icono de la estructura del marco "Superior-Medio-Inferior". En este momento, se insertan dos marcos, superior e inferior, en la página, dividiendo toda la página en tres partes. Ingresamos "superior" arriba, "medio" en el medio y "inferior" abajo.
3. Guárdelo primero. Haga clic en Archivo/Guardar todo en el menú. En este momento, primero guarde el archivo del conjunto de marcos y podrá modificar el nombre usted mismo, como kuangjia.htm. Las otras páginas del conjunto de marcos se guardarán por separado. Al guardar la página correspondiente, esta parte se enmarcará con una línea de puntos, de modo que la parte anterior se pueda guardar como shang.htm. La parte inferior se guarda como xia.htm. La parte central se guarda como zhong.htm.
4. Hasta ahora, hemos guardado cuatro páginas, a saber, el conjunto de marcos y las páginas superior, media e inferior que componen el conjunto de marcos. Por lo tanto, de hecho, este marco se compone de cuatro páginas, por lo que su uso ralentizará la velocidad de navegación del usuario.
5. Haga clic en Ventana/Otros/Marcos para abrir el panel de marco. Haga clic en un marco aquí para seleccionarlo. Cuando se selecciona un marco, aparece una línea de puntos en el marco correspondiente en la ventana de edición.
6. Por ejemplo: seleccione el marco superior de arriba y las propiedades del marco de arriba se mostrarán en el panel de propiedades. También seleccione el marco medio y el marco inferior, y también puede configurar sus propiedades por separado.
7. En la ventana de edición, coloque el mouse en el borde entre los dos cuadros. El cursor cambiará a una forma de flecha hacia arriba y hacia abajo. En este momento, haga clic en el borde para seleccionar todo el conjunto de cuadros.
8. En este momento, las propiedades de todo el grupo de marcos aparecen en el panel de propiedades. Aquí puede establecer si el conjunto de marcos tiene bordes, ancho y color, etc. Pero lo más importante es que puedes establecer el tamaño de cada cuadro en el conjunto de cuadros aquí.
9. Seleccione el marco superior en el icono derecho del panel de propiedades, establezca su comportamiento en 80 píxeles y su borde en 0.
10. Seleccione el marco a continuación y establezca la altura de la línea en 30 píxeles y el borde en 0.
11. Seleccione el marco del medio, establezca la altura de la fila en 1 y la unidad en relativa. (Relativo significa: la proporción de la fila actual en relación con otras filas. Establecerlo en 1 significa ocupar todo el espacio restante de la ventana de navegación excepto la parte superior e inferior.
12. Ejemplo: coloque el cursor en el marco superior, haga clic derecho y seleccione Propiedades de página, y establezca el color de fondo en #FF6600. Luego inserte/tabla, inserte una tabla con 1 fila y 2 columnas, y el margen del borde es 0. Establezca el ancho de la primera celda en 116 píxeles y luego inserte una imagen. Establezca la alineación horizontal de la segunda celda en el centro y la alineación vertical en la parte inferior, y luego ingrese las palabras "Leo", "Capricornio" y "Géminis" en secuencia.
13. Coloque el cursor en el marco principal del marco central, haga clic con el botón derecho y seleccione Propiedades de página, y establezca el color de fondo en #FFFFCC. Luego inserte una imagen grande.
14. Coloque el cursor en el marco inferior, haga clic derecho y seleccione Propiedades de página para establecer una imagen de fondo.
15. Haga tres páginas adicionales como páginas a las que enlazarán "Leo", "Capricornio" y "Géminis".
16. Seleccione "Leo", configure la página a vincular en las propiedades y luego seleccione "mainframe" en "Destino", es decir, el contenido se mostrará en el marco central.
17. Configure también los enlaces para "Capricornio" y "Géminis".
20. Menú de salto
1. Haga clic en Insertar/Objeto de formulario/Menú de salto en el menú principal. También puede usar el icono del menú de salto en Insertar/Formulario para abrir la ventana de configuración del menú de salto.
2. Primero, ingrese las palabras "Seleccione el sitio web correspondiente" en la columna "Texto". Luego haga clic en el botón "+" en la ventana. En este momento, hay una opción adicional en el menú. Esta opción no tiene enlace y solo se usa como texto de descripción para el menú de salto.
3. Ingrese el sitio web deseado en la columna de texto, como "Sina", y luego ingrese la dirección del enlace del sitio web http://www.sina.com.cn en la columna "Al seleccionar, vaya a la URL" en este momento. , el elemento del menú Hay otra opción en la columna, esta opción corresponde a la dirección del enlace de una red.
4. Utilice el mismo método para agregar otras opciones y enlaces correspondientes al menú. También puedes utilizar los botones "arriba" y "abajo" para ajustar su orden.
5. No seleccione la opción "Insertar botón Ir después del menú" en la ventana de configuración. Seleccione el elemento "Seleccione el primer elemento después de cambiar la URL", de modo que después de usar el menú de salto para ir a una página determinada, si regresa a la página del menú de salto, el menú de salto en la página aún mostrará el primer elemento por contenido predeterminado.
6. Haga clic en "Aceptar" después de completar la configuración.
**** Debido a que el menú de salto es un formulario, el formulario (área de puntos rojos) en realidad se inserta primero y luego el menú desplegable se inserta en el formulario.
7. Si desea modificar las opciones, puede seleccionar el menú desplegable en la página. En este momento, haga clic en "Listar valor" en el panel de propiedades para modificar varios contenidos.
8. Cuando se selecciona el menú de salto, el comportamiento también aparece en la ventana de comportamiento. Haga doble clic en el comportamiento para ingresar a la ventana de configuración y restablecerlo.
9. Si el primer elemento en "Elementos del menú" es un enlace en lugar de un mensaje como se mencionó anteriormente, seleccione "Insertar botón Ir después del menú" en "Opciones". Agregue un botón "Ir".
21. Uso de complementos (extensión de función de Dreamweaver)
1. Primero descargue los complementos necesarios. El ejemplo aquí es Animate Browser Window. Este es un complemento que cambia dinámicamente el tamaño de la ventana. Abra Dreamweaver Extension Manager e instale el complemento descargado.
2. Inicie Dreamweaver, en la página creada, haga clic derecho en la esquina inferior izquierda <cuerpo>, luego haga clic en el botón "+" en la ventana de comportamiento, seleccione "Animar ventana del navegador" y luego realice las configuraciones correspondientes. Aquí, la altura y el ancho se establecen en 0 antes de abrir la ventana y para llenar la pantalla después de abrirla. La condición de activación es onLoad.
22. Subtítulos rodantes
1. Coloque el punto de inserción del cursor donde desea insertar subtítulos rodantes.
2. Haga clic en el "Selector de etiquetas" en el panel de inserción.
3. Seleccione la etiqueta de marquesina y haga clic en el botón "Insertar". Luego cierre el "Selector de etiquetas".
4. Cambie a la vista de código. Coloque el punto de inserción del cursor entre las dos etiquetas de marquesina.
5. Seleccione "Ventana"/"Inspector de etiquetas". Se pueden configurar varios usos de las etiquetas en el Inspector de etiquetas.
6. Haga clic en la flecha desplegable en el lado derecho del elemento de configuración de comportamiento y seleccione el método de movimiento del contenido del subtítulo en desplazamiento. Los significados de las tres opciones son: Alternativo: el contenido rueda en direcciones opuestas. Desplazarse: el contenido se desplaza en la misma dirección. Diapositiva: el contenido deja de desplazarse cuando toca el borde del subtítulo.
7. El atributo de dirección establece la dirección de desplazamiento del contenido del subtítulo. Las cuatro opciones significan: abajo: movimiento descendente. Izquierda: moverse hacia la izquierda. Derecha: moverse hacia la derecha. Arriba: movimiento ascendente.
8. El atributo scrollamount establece la velocidad de desplazamiento de los subtítulos. Generalmente se establece en 1.
9. El atributo scrolldelay establece el tiempo de pausa cuando se desplaza el contenido del subtítulo, en milisegundos. Si desea que el desplazamiento se vea fluido, el valor debe ser lo más pequeño posible. En el ejemplo, se establece en 1 milisegundo.
10. El atributo de ancho establece el ancho de los subtítulos en movimiento. Esto es arbitrario, por ejemplo establecido en 300.
11. El evento onMouseOver establece la acción cuando el mouse se mueve para desplazar los subtítulos y, a menudo, está configurado para detener el desplazamiento. El evento onMouseOut establece la acción cuando el mouse abandona los subtítulos en desplazamiento y, a menudo, está configurado para comenzar a desplazarse. Estos dos elementos no se pueden seleccionar y solo se pueden ingresar manualmente. Ingrese "this.stop();" después de onMouseOver e ingrese "this.start();" después de onMouseOut.
12. El atributo de estilo establece el estilo del contenido del subtítulo. En el ejemplo, para configurar el tamaño del texto del subtítulo, también debe ingresar manualmente "font:12px;".
13. El atributo de bucle establece la cantidad de veces que se desplaza el contenido del subtítulo. El valor predeterminado es ilimitado. "-1" también es infinito.
14. Todos los códigos: contenido de subtítulos continuos
23. Crear una hoja de estilo CSS
1. Ingrese algo de texto en la página web.
2. Abra el panel "Estilo CSS" o utilice "Ventana/Estilo CSS" para abrirlo.
3. Hay cuatro botones en la parte inferior del panel: Agregar estilo, Nuevo estilo, Editar estilo y Eliminar estilo.
4. Haga clic en "Nuevo estilo" para abrir el cuadro de diálogo. Ingrese un nombre y tenga en cuenta que hay un punto antes del nombre. Por ejemplo, asígnele el nombre .zi (los nombres chinos no son aceptables). Tipo: Crea un estilo personalizado, definido en: Este documento únicamente.
5. En este momento, abra otro cuadro de diálogo, seleccione "Tipo" en la categoría de la izquierda y luego configure la fuente en Song Dynasty a la derecha, el tamaño en 14 píxeles y cualquier color. Entonces está bien.
6. Seleccione el texto en la página y luego haga clic en Style.zi en la ventana. En este momento, se aplica el estilo CSS a este texto.
7. Si desea modificar el estilo CSS que acaba de definir, puede hacer clic en él y luego hacer clic en el botón Editar estilo a continuación.
24. Cree una hoja de estilo de enlace dinámico
1. Haga clic en el cuadro de diálogo "Nuevo estilo CSS", seleccione "Solo para este documento" en la columna "Definido en" y seleccione "Usar selector de CSS" en la columna "Tipo".
2. Cuando el tipo de hoja de estilo selecciona "Usar CSS Selector", el nombre del menú desplegable cambia a "Selector", lo que indica que el contenido de entrada es un selector CSS. El enlace dinámico.
A: Enlace: el estado normal del hipervínculo;
R: Desventaja, el estado cuando el cursor se mueve al hipervínculo;
3. Establezca estos estados por separado. (naranja).
4. Use el mismo método para establecer A: Visitado, configúrelo en ningún subrayado y configure el color en #FFFF00 (amarillo).
5. SIGUIENTE SET A: Desconectado, configúrelo para subrayarse y configure el color en #FF6600 (naranja).
6. No hay necesidad de establecer A: Active, dependerá automáticamente de A: Hover.
7. Ingrese una oración en la página web y configure su enlace a "#" en el panel Propiedades. Eso es todo.
**** Nota: debe establecerse en el orden de A: Link, A: Visited, A: Hover, y A: Activo, de lo contrario, el efecto esperado no ocurrirá.
Si necesitamos dos o más efectos de enlace en una página, podemos usar el siguiente método:
1. Haga clic en el nuevo botón de estilo, seleccione "Use el selector CSS" para el tipo de estilo, ingrese directamente a A.Link2: enlace en la columna "Selector" y luego establezca A.Link2: enlace a rojo sin subrayar.
2. Continúe definiendo los siguientes dos estilos. Ingrese los nombres directamente y colóquelos en A.Link2: Visitado, sin subrayar en Purple. A.Link2: flotante, azul y subrayado.
3. En este momento, hay un estilo personalizado llamado Link2 bajo la opción "Estilo CSS".
4. Ingrese un párrafo en la página, agregue un enlace #, seleccione el enlace y luego haga clic en el enlace de estilo2 en la ventana de la hoja de estilo para aplicar este estilo al enlace.
5. El mismo método se puede usar para crear diferentes formatos de enlace en la misma página.
**** Para mantener un determinado estilo, no es aconsejable crear demasiados estilos de enlace en la misma página.
25. Hoja de estilo externo
*** Aplique la misma hoja de estilo en diferentes páginas.
1. Cree una nueva hoja de estilo, dale un nombre, luego seleccione "Crear estilo personalizado" para el tipo y seleccione "nuevo archivo de hoja de estilo" para la definición.
2. Después de la confirmación, abra la ventana para guardar la hoja de estilo externa. Luego, guárdelo en su sitio local.
3. En este momento, puede ver que se ha agregado un nuevo archivo de hoja de estilo en la ventana de la hoja de estilo, y el sufijo del archivo es CSS.
4. Si una hoja de estilo interna en la página actual quiere exportarse a un archivo de hoja de estilo externo para su uso por otras páginas, puede hacer clic en el icono gris en la esquina superior derecha de la ventana de la hoja de estilo y seleccionar "Exportar Hoja de estilo" . En este momento, puede seleccionar el nombre de la hoja de estilo y guardar como un archivo externo.
5. Cuando otras páginas necesitan usar hojas de estilo externas, puede hacer clic en el primer botón "Adjuntar la hoja de estilo" en la ventana de la hoja de estilo para abrir la ventana, luego seleccione el archivo de hoja de estilo externo, seleccione "Enlace" en ADD AS, y confirmar.
26. Otros CSS
**** El fondo en CSS es establecer fondo de texto, imagen de fondo de tabla, etc.
**** Bloques en CSS Consulte la configuración del espacio de texto, alineación, subíndice, superíndice, disposición, etc. de texto.
**** El cuadro en CSS se refiere a establecer la distancia en blanco entre imágenes y contenido de texto, y el método de mezclar imágenes y texto.
**** El borde en CSS se refiere al embellecimiento del área de texto de la tabla, botones, etc.
La lista **** en CSS se refiere a establecer el estilo de los elementos de la lista. Es decir, un párrafo similar a un esquema.
El posicionamiento **** en CSS se refiere a establecer el posicionamiento relativo y absoluto de las imágenes en la página.
Extensión **** En CSS, el cursor se puede configurar en el estilo del cursor, que se puede configurar en la mano (tipo de mano), Crosshair (tipo cruzado), texto (tipo "i"), espera (tipo de espera), predeterminado (Tipo predeterminado), Ayuda (tipo de ayuda) y tipos de flecha en varias direcciones.
**** Extensiones en CSS, los filtros en él, se pueden usar para crear efectos de filtro CSS, es decir, para procesar la transparencia, el brillo, etc. de las imágenes. Sin embargo, el efecto no es muy obvio.
27. Cree un álbum de fotos en línea
1. Primero, instale el software Fireworksmx.
2. Procese las fotos que necesita poner en Internet, procesarlas en el mismo tamaño y colóquelas en una carpeta.
3. Haga clic en Comando/Crear álbum de sitio web en el menú para abrir la ventana Configuración.
4. Ingrese el título del álbum, la información del subtítulo y otra información (también puede modificarla más tarde). "Carpeta de imagen de origen", seleccione la carpeta donde acaba de guardar la foto.
5. "Carpeta de destino", haga clic en el botón "Examinar" para seleccionar el directorio de sitio actual. (Guarde todas las fotos en el sitio)
6. Puede seleccionar el elemento del "tamaño de la miniatura" de acuerdo con sus necesidades, y el elemento "Mostrar el nombre del archivo".
7. La celda de la "columna" es el número de imágenes que se muestran en cada fila.
8. Generalmente elija "mayor calidad" para los siguientes dos "formatos".
9. Seleccione la opción "Crear una página de navegación para cada imagen". DE ACUERDO.
28. Función de transición de la página web personalizada
**** La transición de la página web se refiere a los diferentes efectos de actualización que presenta la página cuando el espectador entra o sale de la página web, como desplazamiento, persianas, etc. La página web se verá más dinámica, pero también debe prestarle atención con moderación, de lo contrario, los cambios demasiado elegantes pueden despertar fácilmente el asco de los espectadores. paso:
1. Abra una página, haga clic en Insertar/Etiqueta de encabezado/Meta en el menú, y aparecerá el cuadro de diálogo meta.
2. Seleccione la opción equivalente http en la lista desplegable de las opciones de propiedad en el cuadro de diálogo y escriba la entrada de página en el cuadro de valor para indicar que habrá un efecto de transición de la página web al ingresar a la página web.
3. Tipo RevelationTrans (Duración = 4, Transición = 2) En el cuadro de contenido. contracción.
4. Después de ingresar, haga clic en Aceptar para guardar. De esta manera, cuando hacemos clic en un hipervínculo para ingresar esta página, podemos ver el efecto.
de
veinte efectos para que elija.
Caja Reducir 0 Disolver 12
Expansión en forma de caja 1 Reducción hacia la izquierda y hacia la derecha hacia el centro 13
El círculo se reduce 2 y el centro se expande hacia la izquierda y hacia la derecha 14
Expande el círculo 3 y encoge hacia arriba y hacia abajo hacia el centro 15
Borrar hacia arriba 4 Expandir el medio hacia arriba y hacia abajo 16
Borrar hacia abajo 5 Expandir a la parte inferior izquierda en los pasos 17
Borrar 6 hacia la izquierda Expandir 18 hacia la parte superior izquierda en pasos
Borrar hacia la derecha 7 Expandir hacia la parte inferior derecha en los pasos 19
Persianas verticales 8 Ampliación en forma de escalera hacia la parte superior derecha 20
Persianas horizontales 9 Líneas horizontales aleatorias 21
Tablero de ajedrez horizontal 10 Líneas verticales aleatorias 22
Estilo de tablero de verificación vertical 11 Random 23
23 Veintinueve, aplicación de la biblioteca
**** Se debe usar algunos contenidos en el sitio web repetidamente, como un icono de sitio web hecho por usted mismo, etc. En este momento, este componente se guarda en la biblioteca y se guarda en la biblioteca y se guarda puede llamarse en cualquier momento.
1. Abra una página y seleccione el componente que debe guardar, como un icono.
2. Haga clic en la ventana/recursos del menú para abrir la ventana de recursos. Luego seleccione el botón de la muestra del libro inferior para abrir el panel de la biblioteca.
3. Haga clic en el nuevo botón a continuación para guardar el icono que se acaba de seleccionar en la biblioteca.
4. Cuando desee aplicar el contenido en la biblioteca en una nueva página, abra el panel de la biblioteca, seleccione el icono que desea usar y luego haga clic en "Insertar" a continuación.
30. Use plantillas para completar rápidamente el sitio (página de inicio o una página interna)
1. Primero, planifique el sitio web que desee hacer y diseñe el contenido de cada enlace. Como mi sitio web:
Los enlaces en la página de inicio son: versión web, versión animada, deje un mensaje, sobre mí, contácteme, deseando la botella. El aula ... ... Curectuco original ...
Los enlaces en la versión animada son los mismos que en la versión web.
A continuación se presentan enlaces a varios artículos o páginas de cursos. Por ejemplo, los enlaces de "buscar la verdad en el aula" a una página llena de títulos de planes de lección, y luego de cada título de plan de lección, vincula a la página donde se coloca el plan de lección. Lo mismo se aplica a los demás.
2. Descargue la plantilla de la página web que es más adecuada para su propia planificación y favorita . Otro es que suele ser una carpeta con nombre de imágenes, que es lo que llamamos el lugar donde se colocan imágenes.
3. Defina el sitio y luego copie estos dos archivos (carpetas) en la carpeta del sitio.
4. Haga doble clic en el archivo index.htm para ingresar el estado de edición de la página de inicio. Luego puede modificar la página para satisfacer sus necesidades. Esto completa la página de inicio.
31. Guarde las páginas web existentes como plantillas
**** utilizadas cuando hay una gran cantidad de páginas recurrentes en un sitio web. (Asegúrese de definir el sitio antes de crear una nueva plantilla y usarlo)
1. Seleccione una página y haga clic en Archivo/Guardar como plantilla para guardar la página actual como plantilla. La ventana "Guardar plantilla" abre, dale un nombre a la plantilla y luego guárdela.
2. En este momento, puede encontrar que una carpeta llamada plantillas se crea automáticamente en el sitio, y las plantillas que guardamos se almacenan en este directorio. Su extensión es .dwt
3. Esta plantilla no se puede modificar mientras se está utilizando actualmente. Por lo tanto, debe establecer el área editable de la plantilla.
4. Por ejemplo, en la página de plantilla actual, debe hacer que la parte media de la página sea editable, para que pueda agregarle contenido al usar la plantilla. Seleccione la celda de la tabla en el medio de la página (mantenga presionado la tecla CTRL y haga clic en la celda) y haga clic en Insertar/Plantilla Objeto/área editable en el menú principal. Se abre un cuadro de diálogo, donde puede darle un nombre a la plantilla y hacer clic en Aceptar.
5. El área editable definida en este momento está enmarcada por una línea azul claro, y está el nombre del área en la esquina superior izquierda. Guarde y cierre el archivo de plantilla.
6. Haga clic en Archivo/Nuevo en el menú principal y haga clic en la opción "Plantilla" arriba en la ventana de nueva página.
7. En este momento, los sitios definidos actualmente se enumeran en la columna "Plantilla para". Seleccione una plantilla y puede obtener una vista previa en la columna "Vista previa". Luego haga clic en el botón "Crear" para crear una nueva página.
8. En la nueva página que aparece, excepto el área editable, otras partes no se pueden modificar.
32. Sube tu propio sitio web
1. Solicite el espacio del sitio web y luego cárguelo a Internet. Actualmente, básicamente no hay espacio libre.
2. Después de hacer clic en Aplicar, aparecerá un formulario que solicita el registro, que generalmente incluye nombre de usuario, contraseña, correo electrónico, número de contacto, provincia, nombre de la página de inicio, categoría de la página de inicio, introducción a la página de inicio, etc.
3. Después de completar todo, obtendrá los siguientes elementos: ① Nombre de usuario (recién llenado) ② Contraseña (recién llenado) ③ Dirección de carga FTP ④ Dirección de la página de inicio (a veces los elementos anteriores se envían a la dirección de correo electrónico llena)
4. Descargue e instale el software de carga FTP, puede usar Linteftp (la ventana/software de Kunshan se puede descargar gratis)
5. Abra el software CutefTP y haga clic en Archivo/Administrador de sitios en el menú principal.
6. Complete la dirección de carga FTP, el nombre de usuario del sitio FTP y la contraseña del sitio FTP en el cuadro de diálogo que se abre, y luego haga clic en Conectar para conectarse al servidor del sitio. (Se conectará automáticamente la segunda vez que lo abra, no es necesario que vuelva a completarlo)
7. Después de que se complete la conexión, aparecerá un cuadro en la página. ) a la correcta uno por uno, y la carga se completa.
33. Para promocionar su sitio web,
¿cómo hacer que otros sepan la dirección del sitio web?
1. Use un software especial para registrar su sitio web en los principales motores de búsqueda.
2. Iniciar sesión manual. Por ejemplo, abra Baidu ( www.baidu.com ), y hay un enlace "Iniciar sesión en el sitio web" a continuación. Incluido en el motor de búsqueda de Baidu, para que otros puedan buscar llegar a su sitio web. Lo mismo se aplica a iniciar sesión en otros sitios web.