Etiquetas de Html5 y Comandos Linux

Taller De Sistemas Operativos
Nuevos Comandos de HTML 5

HTML5 responde a este problema proporcionando un conjunto de etiquetas que definen con mayor claridad los bloques principales de contenido que componen un documento HTML. Sin importar el contenido final mostrado por la pgina Web, la mayora de pginas Web consisten en combinaciones de variantes de secciones y elementos de pgina comunes. El cdigo del Listado 2 crea una pgina simple con un encabezado, un rea de contenido y un pie de pgina. Estos y otras secciones y elementos de pgina son bastante comunes, de manera que HTML5 incluye etiquetas que dividen los documentos en las secciones comunes y que indican el contenido de cada una. Las nuevas etiquetas son: header section article aside footer nav El resto de este artculo le ofrece una visin general de cada etiqueta. Tambin aprender sobre la intencin de uso de las etiquetas al revisar el cdigo de ejemplo basado en div del Listado 2 para usar nuevas etiquetas HTML5 estructural.
El rea header
Como su nombre lo sugiere, la etiqueta header tiene por objeto marcar una seccin de la pgina HTML como el encabezado. Listado 3 muestra el ejemplo de cdigo del Listado 2 modificado para que use un header .
Listado 3. Aadiendo una etiqueta header .
<!DOCTYPE html> <html> <head> <title> Una pgina HTML simple </title> </head> <body> <header>Header</header> <div id='content'>Content</div> <div id='footer'>Footer</div> </body> </html>
Principales etiquetas de HTML 5 y Comandos de Linux Jose Arturo Cortes Gonzaga Ingeniera En Sistemas Computacionales Cuarto Semestre
Taller De Sistemas Operativos El doctype en el Listado 3 tambin se cambi para indicar que el navegador debera utilizar HTML5 para presentar la pgina. Desde este punto en adelante, todos los ejemplos suponen que usted est utilizando el doctype correcto.
El rea section
La etiqueta section tiene por objeto identificar porciones significativas del contenido de la pgina. Esta etiqueta es de alguna forma anloga a dividir un libro en captulos. Aadiendo una etiqueta section al cdigo de ejemplo da como resultado el cdigo en el Listado 4.
Listado 4. Aadiendo una etiqueta section .
<!DOCTYPE html> <html> <head> <title> Una pgina HTML simple </title> </head> <body> <header>Header</header> <section> <p> Esta es una seccin importante de la pgina. </p> </section> <div id='footer'>Footer</div> </body> </html>
El rea article
La etiqueta article identifica las secciones principales del contenido dentro de la pgina Web. Piense en un blog, donde cada publicacin de cada individuo constituye una porcin significativa de contenido. Aadiendo etiquetas article al cdigo de ejemplo da como resultado el cdigo en el Listado 5.
Listado 5. Aadiendo etiquetas article

<!DOCTYPE html> <html> <head> <title> Una pgina HTML simple </title> </head> <body> <header>Header</header> <section> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </article> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </article> </section> <div id='footer'>Footer</div> </body> </html>
La etiqueta aside
La etiqueta aside indica que el contenido dentro de ella est relacionado el contenido principal de la pgina pero que no es parte de ella. En cierta forma es anlogo a usar parntesis para hacer un comentario en un cuerpo de texto (como este). El contenido entre parntesis proporciona informacin adicional sobre el elemento que lo contiene. Aadiendo una etiquetaaside al cdigo de ejemplo da como resultado el cdigo en el Listado 6.
Listado 6. Aadiendo una etiqueta aside .
<!DOCTYPE html> <html> <head> <title> Una pgina HTML simple </title> </head> <body> <header>Header</header> <section> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </aside> </p> Este es un aparte de la primera publicacin en blog. </p> </aside> </article> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </article> </section> <div id='footer'>Footer</div> </body> </html>
La etiqueta footer
La etiqueta footer marca el contenido dentro del elemento que es el pie de pgina del documento. Aadiendo una etiquetafooter al cdigo de ejemplo da como resultado el cdigo en el Listado 7.

Listado 7. Aadiendo una etiqueta footer .
<!DOCTYPE html> <html> <head> <title> Una pgina HTML simple </title> </head> <body> <header>Header</header> <section> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </aside> </p> Este es un aparte de la primera publicacin en blog. </p> </aside> </article> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </article> </section> <footer>Footer</footer> </body> </html>
La etiqueta nav
El contenido dentro de la etiqueta nav tiene por objeto propsitos de navegacin. Aadiendo una etiqueta nav al cdigo de ejemplo da como resultado el cdigo en el Listado 8.

Listado 8. Aadiendo una etiqueta nav .
<!DOCTYPE html> <html> <head> <title> Una pgina HTML simple </title> </head> <body> <header>Header <nav> <a href='#'>Algn enlace de navegacin</a> <a href='#'>Algn enlace de navegacin adicional</a> <a href='#'>Un tercer enlace de navegacin</a> </nav> </header> <section> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </aside> </p> Este es un aparte de la primera publicacin en blog. </p> </aside> </article> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </article> </section> <footer>Footer</footer> </body> </html>
Ejemplo completado
Listado 9 muestra el resultado de reemplazar las etiquetas div originales por las nuevas etiquetas HTML5 estructurales.
Listado 9. Ejemplo completado
<!DOCTYPE html> <html> <head> <title> Una pgina HTML simple </title> </head> <body> <header>Header <nav> <a href='#'>Algn enlace de navegacin</a> <a href='#'>Algn enlace de navegacin adicional</a> <a href='#'>Un tercer enlace de navegacin</a>

</nav> </header> <section> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </aside> </p> Este es un aparte de la primera publicacin en blog. </p> </aside> </article> <article> <p> Esta es una seccin importante del contenido de la pgina. Tal vez una publicacin en blog. </p> </article> </section> <footer>Footer</footer> </body> </html>
Comandos de Linux
1) Mkdir: Sirve para crear una carpeta nueva( mkdir carpeta ) 2) Gedit, Nano: Sirven para crear un archivo nuevo ( gedit nombre.extencion ) 3) Chown: Sirve para cambiar de dueo un archivo ( chown--- nuevo usuario--- archivo a cambiar ) 4) Mv: Sirve para renombrar archivos y moverlos ( mv archivo nuevo nombre ) 5) Ls l: Sirve para poder ver el contenido de una carpeta o directorio 6) Cd: Sirve para poder navegar entre los archivos (cd carpeta) 7) Rm: Sirve para borrar archivos( rm nombre del archivo a borrar ) 8) Rm r: Sirve para eliminar pero desde raz o que tienen mas archivas ( rm -r nombre del archivo a borrar ) 9) Cp: Sirve para copiar archivos ( cp archivo a copiar ) 10) Clear: Sirve para limpiar pantalla de la terminal( clear) 11) Kill: Sirve para matar procesos (kill numero de proceso ) 12) Apt-get install: Sirve para instalar un paquete( apt-get install nombre del paquete ) 13) Apt-get remove purge: Sirve para desinstalar paquete(apt-get remove purge nombre del paquete) 14) Chmod: Sirve para otorgar permisos (chmos permios (777) y archivo al que se le asignara)} 15) Cat: Sirve para mostrar el contenido de un archivo (cat archivo) 16) Add user: Sirve para poder agregar un nuevo usuario( add user nombre de usuario) 17) Add grup: Sirve para agragar un grupo de trabajo( add grup nombre del grupo)
Comandos para el manejo de servidores

/etc/init.d/servicio lo que ara el servicio El servicio cuentas con unas opciones las cuales puede hacer: Restart: Sirve para reiniciar el servicio Start: Sirve para iniciar el servicio Stop: Sirve para parar el servicio Reload: Sirve para volver a cargar el servicio Status: Sirve para saber el estado en el que se encuentra el servicio Estos son algunos de los comandos mas utilizados para los servicios.
Creacion de una pagina wep

Para crear la pagina lo primero es acceder al siguiente directorio /etc/var/www En este directorio es donde accede para poder guardar las paginas wep creadas Lo que se ace es Con los comando Gedit y Nado mencionasdos antes creamos un archivo con la extencion html Ejemplo gedit pagina_wep.html Y con esto ya tenemos nuestra pagina wep creada y solo nos queda editarla a nuestro modo y gusto. Y para poder volver a editat la pagina se accede al mismo directorio y se hace la misma orepacion (gedit pagina_wep-html) y asi es como se edita de nuevo la pagina wey si es que no nos agrado su vista preliuminar.

Etiquetas de Html5 y Comandos Linux

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Etiquetas de Html5 y Comandos Linux

Uploaded by

Copyright:

Available Formats

Taller De Sistemas Operativos

Nuevos Comandos de HTML 5

Taller De Sistemas Operativos

Listado 5. Aadiendo etiquetas article

Taller De Sistemas Operativos

Taller De Sistemas Operativos

Taller De Sistemas Operativos

Taller De Sistemas Operativos

Taller De Sistemas Operativos

Taller De Sistemas Operativos

Comandos para el manejo de servidores

Taller De Sistemas Operativos

Creacion de una pagina wep

Taller De Sistemas Operativos

You might also like