Después de copiar algunos gráficos y códigos de efectos especiales de imágenes de algunos sitios web, siempre surgen problemas como que las imágenes no se muestran. ¡Aquí hay un tutorial relacionado escrito especialmente para estos principiantes! Con respecto a la aplicación de imágenes en páginas web, es decir, la aplicación de etiquetas de imágenes en páginas web, ¡déjame resumirlo!
1) Descripción general del marcado de imágenes.
Si una página web solo tiene texto pero no imágenes, perderá mucha vitalidad. Las imágenes son un aspecto muy importante en la producción de páginas web. HTML Professional proporciona la etiqueta <IMG> para enviar imágenes a la página web. Esta etiqueta tiene atributos SRC, ALT, ALIGN, BORDER, WIDTH y HEIGHT.
2) Introducción a los atributos.
Atributo SRC. Para la etiqueta <IMG>, su atributo SRC es un atributo necesario, es decir, a SRC se le debe asignar un valor en la etiqueta <IMG> y es una parte indispensable de la etiqueta. En este momento, IMG debe escribirse en el siguiente formato:
Lo siguiente es un fragmento de cita:
<IMG SRC="valor del parámetro">
Entre ellos, el valor del parámetro es el nombre completo del archivo y la ruta de la imagen.
Sabemos que los archivos de imágenes generalmente ocupan mucho más espacio que los archivos de texto sin formato, como los documentos HTML, y el diseño web a menudo requiere agregar muchas imágenes para aumentar el atractivo. Si estos archivos de imágenes se agregan al documento HTML, éste se volverá muy grande. En general, la transmisión en la red será inevitablemente muy lenta.
La etiqueta <IMG> en realidad no agrega la imagen al documento HTML, pero le dice a HTML: ¿Qué archivo de imagen es? ¿Dónde? Para que HTML pueda llamarlo desde la ubicación original del archivo de imagen. La función del atributo SRC es responder a estas dos preguntas, por lo que el valor del parámetro del atributo SRC debe tener el nombre completo del archivo de imagen, es decir, el nombre del archivo y la extensión, como logo.gif, que responde a la cuestión de qué archivo de imagen es; el valor del parámetro también debe tener la ruta al archivo de imagen para que HTML sepa dónde encontrarlo. Entre los valores de los parámetros del atributo SRC, cómo escribir la ruta del archivo de imagen suele ser un problema para los principiantes.
La ruta al archivo de imagen puede ser una ruta relativa o una URL. La llamada ruta relativa se refiere a la ruta formada por la posición relativa del archivo que se vinculará o incrustará en el documento HTML actual y el archivo HTML actual. Si el archivo HTML y el archivo de imagen (asumiendo que el nombre es logo.gif) están en el mismo directorio, puede escribir el código como <IMG SRC="logo.gif"> si el archivo de imagen está ubicado en un directorio donde el archivo HTML actual se encuentra en el subdirectorio (suponiendo que el subdirectorio se llame imágenes), el código debe ser <IMG SRC="images/logo.gif"> si el archivo de imagen se coloca en el directorio superior del directorio donde se encuentra el HTML actual; donde se encuentra el archivo (suponiendo que el directorio superior se llame home), la ruta relativa debe ser una cuasi-URL, es decir, use "../" para representar el sitio web del desarrollador, seguido de la ruta del archivo de imagen en el sitio web del desarrollador. . Por ejemplo, suponiendo que inicio es un directorio de este sitio web, el código debe ser <IMG SRC=”../home/logo.gif”>. Si inicio es un subdirectorio del directorio king del sitio web, el código debe ser. escrito es <IMG SRC=”../king/home/logo.gif”>.
Otros atributos. Los atributos ALT, ALIGN, BORDER, WIDTH y HEIGHT de la etiqueta <IMG> son opcionales. El atributo ALIGN es la alineación de la imagen, y los valores del parámetro son izquierda, centro y derecha; BORDE es el borde de la imagen, y su parámetro es mayor o igual a 0, y la unidad predeterminada es píxeles; Atributos WIDTH y HEIGHT Es el ancho y alto de la imagen, y la unidad predeterminada de sus parámetros es píxeles; el atributo ALT es el texto que se muestra cuando el mouse se mueve sobre la imagen. Me gustaría recordarles a todos que deben usar esto. atributo al hacer páginas web ¿Cuál es el propósito de hacer esto? Puede mostrar un mensaje de texto cuando la imagen no se puede mostrar por algún motivo, lo que aumenta la facilidad de uso.