CSS - 1 - Introducció a CSS

INTRODUCCIÓ:
Encara que ho fem amb Dreamweaver us en faré una introducció per que veieu quina és la seva utilitat real. Continuament m'heu estat sentint que amb HTML no n'hi ha suficient per controlar l'aspecte de les pàgines web.

HTML és un llenguatge que originàriament es va crear per a que els científics compartissin informació és a dir que no es va preocupar en excés de l'aspecte de les pàgines i no tenia una visió comercial. Simplement pretenia controlar uns quants recursos per donar-li format a una pàgina web. Un dissenyador de pàgines web no es pot considerar realment "dissenyador" si només és capaç de controlar l'aspecte de les pàgines web amb HTML o amb Dreamweaver.

QUINES SÓN LES COSES QUE PODEM CONTROLAR AMB CSS?

• Amb CSS podem controlar entre d'altres aspectes els marges i els farcits i a més pot ser de forma independent. Així un bloc (DIV), un paràgraf (P), un titolar (H1), .... poden tenir un marge en píxels controlat amb precissió per nosaltres, no com abans que depeniem del que el navegador tingués assignat per defecte.
  


• Podem definir la mida del text en píxels, ems, exs, ... cosa que abans no podiem controlar tant bé ja que depeniem del que el navegador de l'usuari tingués assignat per defecte en aquelles mesures que a la etiqueta FONT definiem amb l'atribut SIZE que contenia els valors 1-7. Per altra banda aquí no dependrà de si l'usuari té definit el seu WINDOWS per a que representi fonts grans (120ppp) o fonts petites(96ppp) o que tingui el navegador posat en fonts grans. En contrapartida amb aquesta acció podriem estar perjudicant a usuaris que tinguessin problemes de visió. En tot cas controlant CSS molt bé podriem ajudar a les persones amb dificultats de visió.


• Podem redefinir l'aspecte d'etiquetes HTML, que és una de les raons per les quals convenia que sapiguèssiu de memòria HTML, ja que ara podrem aplicar estils CSS a etiquetes en concret. Com que teniu un vocabulari suficient i sabeu per a què serveixen les etiquetes principals(P, TABLE, TD, OL, UL, LI, BODY, B, SPAN, DIV, ...) doncs....


• Podem sustituir les vinyetes de les llistes per imatges, com ara els típics llàpiços o forquilles de les receptes de cuina.


• Recordeu que quan posavem una imatge de fons a una pàgina web, una taula o una cel·la aquesta imatge es repetia indefinidament donant lloc a un motiu? Doncs ara amb CSS podrem controlar aspectes com la repetició o no, la repetició en horitzontal o en vertical d'aquesta imatge de fons, el centrat vertical i/o horitzontal d'aquesta imatge respecte a l'espai de que disposa, posar la imatge cap amunt, cap a l'esquerra, cap a la dreta, cap a baix, ...


• L'interliniat.


• L'espai entre caràcters i entre paraules.


• maquetacions líquides amb DIVS en comptes de fer servir taules. Un exemple d'això el tenim en aquest blog.


• Podem treure el subratllat dels links i definir als links l'aspecte que hauràn de tenir si el ratolí clica, passa per sobre, etc... Amb això podriem fabricar botons des de CSS ja que el que s'obté no és ni més ni menys que


• Posar cursors escollits per nosaltres, com per exemple rellotges de sorra, creus, l'interrogant, etc...


• Definir la sangria de la primera lletra d'un paràgraf.


• Capes flotants,...


• Definir la mida de les etiquetes H1 i controlar millor els seus marges.


• Podem fer versalites.


• etc...

Us recomano que visiteu el tutorial sobre CSS que trobem a DESARROLLOWEB. Cliqueu aquí.