lt;/htmlgt; Lo que estás viendo es HTML, que es un lenguaje de marcado de hipertexto con un tipo de documento HTML o algo así como XHTML, etc. Podemos abrir cualquier página web (las páginas web están compuestas de HTML) y guardarla como. Si no realizamos ninguna modificación, obtendremos un documento que termina en .html. html es el sufijo de documento HTML más común y usa . htm, el sistema sólo podía aceptar hasta tres sufijos, pero ahora se debe utilizar html. Entonces, ¿dónde está el CSS? Tienes razón entre las cuatro situaciones anteriores, la última letra roja grande debería ser la más fácil de explicar la relevancia de CSS. Puedes probarlo si también usas el buzón QQ (de hecho, se puede usar en situaciones generales). Primero ingrese el texto "Préstame diez yuanes para el desayuno", luego selecciónelo, luego haga clic en la barra de herramientas de edición de arriba (esto es muy similar a editores como Word / WPS, pero es una versión web), haga clic en el botón Tt, seleccione la opción Máximo, que hará que el párrafo de arriba sea más grande, luego haga clic en el botón A en la parte superior del borde inferior del color, seleccione Rojo grande y se convertirá en: un carácter muy grande. Ahora viene el punto clave. Haga clic en el botón lt; HTML > en la barra de herramientas para ver el código fuente del correo electrónico. Puede ver (tiene hambre...) que no hay CSS: lt; color="#ff0000"gt; ¡Préstame diez yuanes para el desayuno! lt;/fontgt;Lo anterior sigue siendo HTML, pero podemos ver que contiene color="#ff0000" (originalmente pensé que se usaría CSS estándar), lo que significa que el color del texto interior es #ff0000 y ¿qué es #ff0000? Hablaré de esto más adelante, pero les diré directamente aquí que significa rojo. Aunque no he leído el CSS, no importa. Elimine las tres líneas superiores y luego copie las tres líneas inferiores en la posición eliminada. y luego haga clic en el cuadro de edición en la esquina superior izquierda para volver a editar. En el botón del navegador, encontrará que la fuente es un poco más grande y el color es rojo: div style="font-size: 3em; color: #ff0000" (Originalmente pensé que usaría CSS estándar), lo que significa que el color del texto aquí es #ff0000, ¿y cuál es #ff0000? 3em; color: #ff0000"gt; Préstame diez dólares para el desayuno lt; /divgt; ¿Por qué? Aquí, style="font-size: 3em color: #ff0000" Este párrafo es un ejemplo de CSS y su Lo que hace es aplicar estilo al elemento HTML; en el ejemplo anterior, aplica estilo al elemento que es un DIV (¿Qué es un elemento HTML? ¿Qué es un elemento HTML? Hablaré de eso más adelante, pero aquí, un DIV es un elemento), por lo que el tamaño del texto es 3em (tamaño de fuente: 3em) y el color del texto es rojo (color: #ff0000).

Ahora debería tener una idea: HTML crea páginas web y CSS diseña elementos HTML, por lo que CSS diseña páginas web. Ahora también debe saber que las páginas web están compuestas de HTML. Entonces, piénselo de nuevo, ¿es necesario CSS? Para explicarlo brevemente, ahora usamos un editor de texto sin formato (si está usando un sistema Windows, abra el software Bloc de notas) para crear un nuevo archivo y guardarlo como demo.html, luego copiamos el siguiente código en el archivo y luego lo guardamos. eso. puede: lt;! DOCTYPE htmlgt;

lt; html lang="zh-CN"gt;

lt; /gt;

lt; títulogt; página de muestra

lt; lt;h1gt; Página web de muestralt;/h1gt;

lt;pgt; Esta es solo una página web de ejemplo muy simple, de la pila.

lt;/bodygt; p>lt;/htmlgt; Después de guardar, haga doble clic en el archivo nuevamente para verlo. Después de hacer doble clic en él, el Bloc de notas no se abrirá, pero se abrirá el navegador (el navegador predeterminado configurado actualmente en su sistema). Hay dos líneas de contenido en el navegador, una línea es el contenido de la "Página web de muestra" en. fuente más grande y la siguiente línea es una oración con una fuente más pequeña, similar al efecto siguiente. Esta es solo una página web de ejemplo muy simple de Matrix. Esta es una página web de ejemplo muy simple de Matrix Stack. ¿Por qué sucede esto? ¿A dónde fue el o

que ingresamos? Si descubre que faltan, como dije antes, haga clic derecho en la página web actual y haga clic en Ver código fuente, encontrará que el código fuente es el carácter que ingresó. En el ejemplo anterior, el contenido de la página web invisible son todas etiquetas HTML o elementos HTML, como lt; h1gt;, que es una etiqueta HTML. Hay muchas etiquetas diferentes en HTML y las diferentes etiquetas tienen su propio significado especial, como. como lt; h1gt; significa "título de primer nivel", o título 1. En HTML, el título tiene seis niveles, a saber, h1 a h6. También en el ejemplo anterior, pgt;, *lt ;bodygt; son todas etiquetas HTML. Cuando abrimos cualquier sitio web, el navegador en realidad lo ayuda a solicitar datos de un servidor en la red. En términos generales, si el navegador le muestra directamente los datos solicitados, entonces los datos solicitados generalmente son un documento HTML (por qué). ¿Se dice que generalmente es un documento HTML en lugar de decir que definitivamente es un documento HTML?) Este es el texto en el ejemplo anterior. Como se mencionó anteriormente, debido a que las etiquetas HTML tienen significados especiales, el navegador mostrará cada etiqueta en el. usuario del navegador según su significado La visualización mencionada aquí no muestra directamente el texto. Por ejemplo, puede hacer el siguiente ejemplo para mostrar una etiqueta HTML en el archivo demo.html.

En el archivo demo.html del archivo html, debajo de la línea del archivo html del archivo demo.html anterior, agregue la siguiente línea: lt;h2gt;Demo webpagelt;/h2gt;lt;h3gt;Demo webpagelt;/ h3gt Después de guardar, ábralo con un navegador y encontrará que el mismo texto tiene diferentes tamaños de fuente debido a las diferentes etiquetas HTML utilizadas. Esta es la diferencia en la interpretación de estas etiquetas por parte del navegador. Sabe que este contenido es un título. Necesito poner este texto en negrita y mostrarlo con el número de fuente máximo, pero

es una etiqueta HTML y este texto no es necesario mostrarlo. Entonces, ¿dónde está el CSS? Luego modifique el archivo demo.html y cambie la línea h1 a lo siguiente: h1 style="color: #ff0000"gt; Página web de muestralt;/h1gt; Luego abra el archivo con un navegador. Encontrará estas cuatro palabras en. la página web de muestra ahora se ha vuelto roja. El estilo="color: #ff0000;" ingresado aquí es una línea de código CSS. Ya deberías saberlo del ejemplo anterior del buzón de QQ, lo que significa que el texto en el elemento HTML debe ser. se muestra en rojo. Mira, es un elemento HTML con estilo CSS. Cambiemos esta línea nuevamente a lo siguiente: lt; h1 style=" color: #ff0000; font-size: 12px; "gt;Ejemplo pagelt;/h1gt; Abra este archivo con un navegador y vea qué efecto tiene. ¿Es cierto que además de cambiar los cuatro caracteres a rojo, el tamaño de fuente también se hizo más pequeño? Una comprensión un poco más profunda de HTML y CSS En el ejemplo anterior, creamos un encabezado de primer nivel, un encabezado de segundo nivel, un encabezado de tercer nivel y un párrafo (lt; pgt; creado). el encabezado de primer nivel es muy grande o negrita, el color es negro, luego lo cambiamos a rojo y finalmente incluso la fuente se cambió a un tamaño muy pequeño, entonces, ¿por qué h1 era más grande que h2 antes de realizar estos cambios? La razón es muy simple. Recuerde lo que dije antes, cuando el navegador ve la etiqueta HTML, mostrará el contenido de la etiqueta según su significado. Para la etiqueta h1, el navegador cambia el tamaño de fuente y luego crea el texto. negrita, etc. Espera, de hecho, simplemente especificas un estilo CSS predeterminado para h1. Aunque no lo expresaste, el navegador sabe que a partir de ahora necesitas instalar un navegador Google Chrome (). Si no sabe cómo instalarlo, no siga leyendo, es importante aprender los conceptos básicos de informática), luego abra la demostración usando Google Chrome.

html (restaure el archivo a la versión no modificada anterior, que es la versión guardada al principio, con solo un encabezado de primer nivel y un párrafo. Después de abrir el archivo, también verá una página web similar a la anterior). uno Ahora, haga clic en el botón Atrás del mouse sobre las cuatro palabras grandes del ejemplo y luego haga clic en la opción Inspección de elementos en el menú emergente. Esto abrirá una subventana dividida en dos columnas en la parte inferior. Debería mirar la parte posterior, que es el código fuente de su página web, y en el lado derecho, hay muchas opciones. Haga clic en el elemento Calcular estilo en el primer elemento y verá el siguiente contenido: pantalla: bloque; tamaño de fuente: 32px; peso de fuente: negrita; alto: 38px; ancho: 935px puede ser diferente en el párrafo anterior, ¿por qué es diferente? Este código es un estilo CSS, pero no especificamos ningún estilo, ¿por qué deberíamos especificarlo? Esto se debe a que el navegador agregará un estilo predeterminado a cada etiqueta HTML según su significado, y el estilo CSS anterior es el estilo predeterminado agregado por el navegador Google Chrome para la etiqueta h1. En este momento, debe saber por qué podemos ponerlo. arriba ¿Se ha cambiado el tamaño de fuente a un tamaño más pequeño? ¿Recordar? Cuando configuramos el tamaño de fuente de h1 en 12px, la fuente se hará más pequeña. Esto se debe a que el nuevo estilo sobrescribirá el estilo anterior, por lo que en el ejemplo anterior, 12 px sobrescribirá 32 px, por lo que la fuente será más pequeña. Versiones de HTML y CSS HTML y CSS, al igual que el software que utilizamos habitualmente, también tienen sus propias versiones (por ejemplo, QQ, el software más utilizado por los chinos, tiene la versión 2011, la versión 2012 o la versión 2013, etc.) . ), para HTML, diferentes versiones reflejan algunas de sus etiquetas únicas, o las mismas etiquetas no tienen el mismo significado, y para CSS, diferentes versiones también pueden tener sus propios atributos únicos, las cosas siempre están en En el proceso de desarrollo, ¡En general se está desarrollando para mejor! El desarrollo de las cosas siempre está en proceso de desarrollo continuo y, en general, se desarrolla en una buena dirección. Lo mismo ocurre con HTML y CSS. Las nuevas versiones siempre proporcionarán muchas funciones y características para satisfacer las necesidades de la gente moderna, como At. Primero, la página web no podía reproducir videos, pero luego sí, pero agregar un video a la página web era muy problemático. Ahora, no solo se pueden reproducir videos, sino que agregar videos se ha vuelto muy simple, queríamos hacerlo hermoso. Las páginas web son muy engorrosas y ahora están disponibles la tecnología 3D, la animación, etc. Ahora bien, ¿qué tecnología 3D, animación, etc. Se puede implementar a través de CSS, que es muy simple. Entonces, en cuanto a la versión, si eres novato, te recomiendo que vayas directamente a la última versión y, en la mayoría de los casos, solo hablaré de la última versión. pero dado que la última versión del navegador no tiene muy buen soporte, si toma esta tecnología como carrera en el futuro, es posible que deba investigar usted mismo otras versiones en la nube o programas compatibles, por ejemplo, en HTML5. una etiqueta navgt, que representa la navegación. HTML5 no existía antes, por lo que los navegadores que no admiten HTML5 no saben qué hacer cuando ven esta etiqueta. En este momento, debemos reemplazarla con otras etiquetas alternativas o usarla. algunos métodos especiales para decirle al navegador antiguo qué hacer.

Cómo ver y definir la versión HTML de un documento HTML Por ejemplo, aquí hay un ejemplo: lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML RDFa 1.0/EN" 3.org/MarkUp/DTD/xhtml- rdfa-1.dtd"gt;

lt; html xmlns=3.o www.hbbz08.com rg/1999/xhtml/vocab"gt;

lt; equiv="Contenido -Tipo" content="text/html; charset=utf-8" / gt;

...

lt; fragmento de un sitio web, gran parte del contenido se omite en el medio. Puede verificar la versión HTML utilizada por la página desde la primera línea, es decir: lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML RDFa 1.0. //Ew3.org/ MarkUp/DTD/xhtml -rdfa-1.dtd"gt; Sin embargo, la buena noticia es que ya no necesita agregar una cadena tan larga a la página web al escribir cualquier documento HTML. Solo necesita para verse como lo siguiente: lt;!DOCTYPE htmlgt; El último HTML5. Sólo necesita declarar el tipo de documento como HTML. Ya no necesita especificar la versión específica de HTML y no tiene que preocuparse por los navegadores antiguos. incompatible Todos saben lo que es. Una pequeña extensión. En todos los ejemplos anteriores, hemos escrito el estilo CSS como un atributo de la etiqueta HTML. El nombre del atributo es estilo, pero esto es solo un ejemplo, es posible que también lo escribamos de esta manera. , pero recuerde que esto no significa que debamos escribir así, al contrario, no debemos escribir así, y la razón es esta: HTML se usa para definir la estructura del documento, y no debemos escribirlo. en la estructura de los estilos del documento, pero deben estar separados, lo que llamamos separación de estructura y estilo, para lograr la separación de contenido y estilo. Una forma sencilla de lograr esto es escribir el estilo CSS como un .CSS separado. archivo. css como sufijo, y luego use una etiqueta de enlace en el documento HTML para introducir el archivo CSS en el documento HTML. De esta manera, si queremos modificar el estilo de los elementos en el documento HTML, no necesitamos modificarlo. el documento HTML, pero solo necesita modificar su archivo de estilo.