TEORIA DE L’ESTIL CSS.

Bàsic

Nosaltres seguirem el tutorial de w3schools sobre CSS per entendre més a fons el seu funcionament, la pàgina és https://www.w3schools.com/css/default.asp

Pàgines d’experts CSS

Per saber més profundament, existeixen pàgines que es dediquen a explicar trucs de css https://css-tricks.com/video-screencasts/

https://tutorialzine.com/2014/07/20-impressive-css3-techniques-libraries-and-examples.

Editor i generador online per crear els dissenys css, html i javascript https://html-css-js.com/css/generator/border-outline/

Conceptes clau per entendre CSS.

Què és i què fa?

CSS és el llenguatge que dona estils a una estructura html.

És estandart i el reconeixen els navegadors, s’acopla al llenguatge html amb la marca <style>…codi css…</style>.

Usant CSS (Full d’Estils en Cascada) es poden aplicar estils sobre una pàgina web amb l’objectiu d’aconseguir un format de pàgina dessitjat. Això s’aconsegueix amb la connexió del CSS sobre el DOM (Model de Document d’Objectes).

Els elements (per exemple <h1> <h2> <p> …. ) d’una pàgina HTML tenen estils  predefinits, amb l’ús del CSS es pot donar un estil a qualsevol tipus d’element de la pàgina.

Exemple: Per canviar de tots els elements <h1> de la nostra pàgina introduïm el codi

<head>
<style>
h1 {color: red;}
</style>
</head>
<body>
<h1>Som h1 en color vermell.</h1>
<h1 style="color: blue;">Jo som h1 en color blau</h1>
<h1>Som h1 en color vermell.</h1>
</body>
</html>

El resultat:

Som h1 en color vermell.

Jo som h1 en color blau

Som h1 en color vermell.

Pràctica d’entrega i avaluació.

Per editar: document per editar

S’ha de realitzar un site amb els vostres exercicis.

Aquesta ha de tenir:

  • Un document d’intencions i disseny del vostre Site. El document també estarà dins una pàgina del site.
  • Capçalera de posició sticky, títol i nom.
  • Un missatge “fixed” que retorni a la pàgina general d’exercicis.
  • Tots els exercicis enumerats i classificats per jerarquia.
  • Un menú amb submenús que accedeixin directament sobre l’exercici.

 

 

 

 

 

Serveis protocolaris usats al web.

http://animateyourhtml5.appspot.com/pres/index.html?lang=en#1

http://animateyourhtml5.appspot.com/

admin2on batxilleratTEORIA DE L'ESTIL CSS. Bàsic Nosaltres seguirem el tutorial de w3schools sobre CSS per entendre més a fons el seu funcionament, la pàgina és https://www.w3schools.com/css/default.asp Pàgines d'experts CSS Per saber més profundament, existeixen pàgines que es dediquen a explicar trucs de css https://css-tricks.com/video-screencasts/ https://tutorialzine.com/2014/07/20-impressive-css3-techniques-libraries-and-examples. Editor i generador online per crear els dissenys css, html i javascript...Blog Aula Informàtica Gimnèsia