Differences

This shows you the differences between two versions of the page.

--- es:web_development:lists:menus [2022/03/15 08:36]
ander [Objetivo]
+++ es:web_development:lists:menus [2023/08/16 09:33] (current)
@@ Line 10: / Line 10: @@
   * Seleccione la nueva carpeta y use Ctrl-N y Ctrl-S para crear un archivo guardado como 'menu.html'.
   * Escriba 'html' y seleccione 'html:5' para completar el archivo con el código base.
-  * Introduzca una nueva línea en <html><head></html> y enlace a una hoja de estilo externa (escriba 'link' y seleccione 'link:css').
+  * Introduzca una nueva línea en la etiqueta <html><head></html> y enlace a una hoja de estilo externa (escriba 'link' y seleccione 'link:css').
   * Cree y guarde un archivo llamado 'style.css'.
 ==== Barra Lateral ====
   *  Muchos sitios web utilizan una barra lateral para la navegación o los enlaces. Es esencialmente una lista de enlaces, por lo que una estructura de lista es más efectiva.
-  * Vamos a crear una lista de las actividades que hemos hecho hasta ahora. Agregue este código dentro de las etiquetas <html><body></html>.
+  * Vamos a crear una lista de las actividades que hemos hecho hasta ahora en el documento 'menu.html'. Agregue este código dentro de las etiquetas <html><body></html>.
 <code>    <ul>
         <li>Historia divertida</li>
@@ Line 37: / Line 37: @@
   * Intenta hacer clic en el enlace. Debería llevarte directamente a tu Historia Divertida jsfiddle.
   * Observe que todavía está usando la misma pestaña. Si desea volver a su menú, debe usar el botón 'atrás'. Podemos cambiarlo para que el enlace abra una nueva pestaña.
-<code><li><a href="https://jsfiddle.net/maganthro/xv5bpf06/13/" target="blank">Historia divertida</a></li></code>
+<code><li><a href="https://jsfiddle.net/maganthro/xv5bpf06/13/" target="_blank">Historia divertida</a></li></code>
   * El <html>target</html> atributo especifica la pestaña de destino. Puede nombrar sus pestañas para que pueda elegir qué pestaña sobrescribir, pero '_blank' siempre abrirá una nueva pestaña. Intentalo.
   * El segundo enlace está en el mismo servidor, por lo que no necesitamos escribir todo. Podemos usar una dirección 'relativa' como esta.
@@ Line 59: / Line 59: @@
     display: inline;
 }</code>
-  * <html>display</html> tiene muchas opciones que presentan el elemento como bloque o en línea (o no se muestra) dependiendo de los elementos que los rodean. Al configurar los elementos de nuestra lista, <html>inline</html> es estamos diciendo que se muestren horizontalmente.
+  * <html>display</html> tiene muchas opciones que presentan el elemento como bloque o en línea (o no se muestra) dependiendo de los elementos que los rodean. Al configurar los elementos de nuestra lista, <html>inline</html>  estamos diciendo que se muestren horizontalmente.
   * Abra su 'menu.html' en Live Server y verifique los resultados.
   * Si aún ve las viñetas en su menú, no se ve tan bien, así que eliminémoslas nuevamente.
@@ Line 89: / Line 89: @@
 ==== Codigo Final ====
-  * [[https://techschool.murraygunn.id.au/webdev/classes/lists/3/es.php|lists.html]]
+  * [[https://techschool.murraygunn.id.au/webdev/classes/proyecto/1/es.php|menu.html]]
-  * [[https://techschool.murraygunn.id.au/webdev/classes/lists/3/style.php|style.css]]
+  * [[https://techschool.murraygunn.id.au/webdev/classes/proyecto/1/style.php|style.css]]
-  * [[https://techschool.murraygunn.id.au/webdev/classes/lists/3/lists.html|resultado]]
+  * [[https://techschool.murraygunn.id.au/webdev/classes/proyecto/1/menu.html|resultado]]
 [[es:web_development:lists:javascript|Siguiente: JavaScript]]

Tech School

User Tools

Site Tools

Differences

Page Tools