J = 5 SJ CURSO VISUALY PRACTICO DLT acodKo acelin <=1ike ms backend Background, border, margin y padding \ Propiedad Display \ Elemento Classes a Q @git mau(235 curso visual y prActico oY Yy-Tacedl om icedsnecine| Reeth WEB Full Stack fey Ceds dike) Direccién Edo MiguoLodertremer ‘anion al ctor, ‘suscripcionas y ventas [email protected] rs 454011) 4110-5700 Nv +52-58-8821-9560 Publicidad ublidadsredusers.com 454/011) 4110-3700 Edicion Fernerdo Ojam ‘Autor Fernando Lana Produceion grfica Gustavo De Matteo ‘since Argonina Cpt Vo pw hie A. Ee R19 tr 08 Co Brea el +5401 406 964008 oer Dee ‘altplaas SA QBN Sethe 1:27 1SSHEM, Ben As Te tO 4806-018 Mec DF reo isincraS ACN, hte? Ia ache Pda (Ga Cote S515 Mann er Co rhs pets loc ess So CV rom WED Ck rar Mein, Ogi TAC.) Us ee (Com Te 512267. an Certo Skea SA, hapten Paar E35 pi 2S ee Lr S11 1290 rem 2 ray Exe SRL, Pay 124, ai Te 30 ¢ 076s Veet Dr bars Carns Bo Ge Aas, Too Bo oe as P2)3" Pu San Ns. owe al La PCa 88212-40842. (oyu y racic So Teen, twit: Fox aS 1 Novara d 180, 1890, CTSOAE, Oued Avon do Bac: Aus, Agen Fata Wea Cayigt © WANE. 254-855 Ts x cos rac tap raps rea nie pa po rin mato.cmel pen pep de (saa edi Later me xune esa are cle crac ea deacon, coro yo lei Gels envoy as ues sb nano ptt a as frst pn obs As ab ere Ws, 4 el Trans OE bal ER pa on Srp. tao 225 Fut, nd Boy, Ae ET at Faill Stack Fl | —— oa oe iva Ree 011-4110-8700 | USERSHOP.REDUSERS.COM [email protected] tits inane 3 CSS3 GID Fundamentos de CSS BIBI Buenas practicas en el uso de CSS DE Sintaxis GIB Background GIG Border GIB Height y width HIB Margin y padding HIE Propiedades text HIG Text Overfiow HIG Element Classes HIB Hipervincutos HBB Listas CSS, HIE Display BIE Efectos a través de text-shacow CONTENIDO ADICIONAL ONLINE Codigo fuente, elementos graficos utilizados en los ejemplos y otros contenidos adicionales se pueden descargar en redusers.com/u/programadorwebFundamentos de CSS Las hojas de estilo en cascada (denominadas también CSS por su sigla en inglés de Cascading Style Sheets) agrupan, en su interior, un lenguaje de texto orientado al diseito grafico, que permite definir y presentar de forma estructurada los documentos escritos a través de un lenguaje de marcado, como es HTML. Las hojas de estilo son el componente clave para aplicar un disefio visual alas paginas web ya otras interfaces de usuario, como las aplies maviles hibridas, escritas en HTML. SS nacié en 1996, practicamente junto con la web ‘comercial, Hoy ya cursa su version 3.0 y,a través de sus diversas propledades, métodos y estilos, se puede lograr ‘con muy poco esfuerzo, desde un simple cambio grafico sobre un texto o imagen hasta animaciones complejas con graficos, aplicables a cualquier web. ‘Au ves, CSS permite controlar de forma homogénea ‘cuando una pagina se visualiza en una pantalla amplia, ‘mediana o pequetia, y asi aplicar los estilos correctos sobre los archives HTML, para que estos muestren la informacién de manera clara y ajustada al display donde ella se visualiza, Amagen 02. Los ejemplos que fuimos realizando en HTML nos dovolvian resultados en ‘contenido plano, similar al de los, ta www. Imagen Ot CSS es el segundo componente del tridente ‘web mas importante actualidad, Es el cédigo que ‘se ocupa de dar vida gratica al contenido por el cual navegamos. Elpapel principal de SS. poder separar elcontenido de los documentos de un sitio ‘web, dela forma enla cual se presentan estos. Todas las caracterfsticas que ‘componen un sitio web, como las fuentes, las imagenes, los colores y las tablas, entre otros recursos, pueden ser tratadas como capas individuales, y asilograr mejor accesibilidad y control sobre cada documento HTML. En elmomento de querer cambiar estéticamente un sitio web por completo, con solo modificar el olos archivos CSS, Ja web podra uci completamente diferente a lo que era antes, Esto requiere muy poco esfuerzo, y practicamente zno se modifica nada de las documentos HTML. Imagen 8. Con una hoje de estilo CSS vinculada al documento HTML, cambiamos REDUSERS El PROGRAMADOR WEB Full Stack aBuenas practicas en eluso de CSS Enla introduccién a HTML realizada en la clase anterior, prenditos que el tag contiene informacion aque permite formateary aplicarfuncionalidad sobre las piginas web, La implementacin de CSS en un dacumento HTMILse realiza a través de un tag espeelfico, que se debe uibicar dentro de los tags propios del documento HTML. La forma de implementacién de CSS puede realizarse de dos maneras: 1. Abriendo el tag