Sesión 5 - CSS

¿Qué es CSS?

Cascading Style Sheets u hojas de estilo son un conjunto de instrucciones que le dictan al navegador como debe dibujar los elementos en pantalla. El uso de hojas de estilo permite separar el contenido del documento de la presentación del mismo.

Resultado de imagen para css

Sintaxis


Para información más detallada el siguiente link puede ser de utilidad: https://www.w3schools.com/css/css_syntax.asp 

Enlazar con HTML

Existen diversas formas de usar un HTML con CSS, a continuación presentamos algunas de ellas:


  • Usando un link: 
<link rel="stylesheet" type="text/css" href="mystyles.css" media="screen" />

  • Empotrando en el HTML:
<style type="text/css" media="screen">

/* Add style rules here */

</style>
  • Entre líneas:
<h2 style="color:red; background:black;">This is a red heading with a black background</h2>


Referencias

CSS Tutorial. (n.d.). Retrieved from https://www.w3schools.com/css/default.asp

How to add CSS to HTML. (n.d.). Retrieved from https://matthewjamestaylor.com/add-css-to-html

Luján, S. (n.d). HTML5 and CSS3 – The Future of the Web Programming. Universidad de Alicante. Retrieved from: http://rua.ua.es/dspace/bitstream/10045/20201/15/03-CSS.pdf

Solano, E. (2018). HTML CSS JavaScript.  Curso Introducción al desarrollo de aplicaciones WEB - IC8016.

Comentarios

Publicar un comentario

Entradas más populares de este blog

Sesión 6 - Javascript

Imagen
¿Qué es Javascript? Javascript es considerado el lenguaje de programación de HTML y por ende, de la web. Es un lenguaje dinámico, levemente tipado y multiparadigma. ¿Por qué usar Javascript? Permite controlar el comportamiento de las páginas web. Permite la creación de páginas web dinámicas. Puede usarse en aplicaciones móviles, desktop applications y web applications. Facilidad  de uso. Amplia comunidad de desarrolladores que lo usan. Permite el uso de Single-page applications (el navegador se encarga de representar la página). ¿Cómo usar Javascript? Una de las formas más sencillas y conocidas para usar Javascript en nuestra página web es usando el evento onclick , en HTML la sintaxis sería algo así:  <element onclick="myScript"> Este evento se usa en la mayoría de casos para darle funcionalidad a botones, aunque también puede funcionar con otros tipos de elementos. Ejemplo: -----------------------------------------------
Leer más

Sesión 3 - Ejemplo de uso de servlets y JSP

Imagen
Enunciado A continuación se presenta un enunciado con el trabajo a desarrollar en este ejemplo, el siguiente PDF, describe que se debe hacer con el fin de que el ejemplo pueda ser considerado válido. 1. Creación de un nuevo proyecto Para este ejemplo, usaremos Netbeans IDE 8.2, por lo que para crear la aplicación Java Web, la guía será sobre este IDE. En caso de usar otro, puede brincar hasta el paso 2. Al hacer click en Nuevo Proyecto... se abrirá una ventaja como la siguiente, en este caso crearemos una aplicación Java Web > Web Application. Seguidamente, asignamos un nombre y ubicación a nuestro proyecto. Finalmente, podemos escoger el servidor web a usar. En caso de no tener servidor, será necesario descargar uno y seguidamente agregarlo con el botón Add mostrado en la siguiente captura. En este caso usaremos GlassFish Server 5, pero es posible usar cualquier otro servidor. Después de este paso podemos dar a Finish. 2. Creaci
Leer más

Laboratorio 1 : Desarrollo práctico de una página WEB acerca de su vida personal

Imagen
Para este laboratorio se tomará en cuenta únicamente la parte visual de la página web, es decir no se realizará funcional. Para entender mejor lo solicitado se presenta el enunciado del Laboratorio 1: Para acceder al código HTML y CSS de la  página web creada como resultado del laboratorio use el siguiente link:  https://drive.google.com/drive/folders/1byjlM9hELTEGUPWGojJ3YUDIHoQddy8v?usp=sharing NOTA: En el los archivos subidos, el link al CSS contiene un path local, basta con cambiar el path a  "css/custom.min.css" Elementos usados HTML <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">:  se encarga de que la página realizada tenga la característica responsive, esto diciéndole al navegador como debe ajustarse.  <li><a class="active" href="home.html">Home</a></li>: usado para representar un item en una lista, en este caso, se usó como elemento del m
Leer más