logo

Tipus de CSS

CSS (Full d'estil en cascada) descriu els elements HTML que es mostren pantalla, paper , o dins altres mitjans . S'estalvia molt de temps. Controla el disseny de diverses pàgines web alhora. Estableix el font-size, font-family, color, color de fons a la pàgina.

Ens permet afegir efectes o animacions al lloc web. Fem servir CSS mostrar animacions M'agrada botons, efectes, carregadors o filadores , i també fons animats .

Sense utilitzar CSS , el lloc web no semblarà atractiu. N'hi ha 3 Tipus de CSS que estan a continuació:

  • CSS en línia
  • CSS intern/ incrustat
  • CSS extern
Tipus de CSS

1. CSS intern

El CSS intern té etiqueta a la secció de la HTML document. Aquest estil CSS és una manera eficaç d'estilitzar pàgines individuals. L'ús de l'estil CSS per a diverses pàgines web requereix molt de temps perquè necessitem col·locar-lo estil a cada pàgina web.

Podem utilitzar el CSS intern seguint els passos següents:

1. En primer lloc, obriu el HTML pàgina i localitza el

2. Posa el codi següent després de

 

3. Afegiu el regles de CSS a la nova línia.

Exemple:

 body { background-color: black; } h1 { color: white; padding: 50px; } 

4. Tanqueu l'etiqueta d'estil.

 

Després d'afegir el CSS intern, el fitxer HTML complet té l'aspecte següent:

 body { background-color: black; } h1 { color: red; padding: 50px; } <h2>CSS types</h2> <p>Cascading Style sheet types: inline, external and internal</p> 

També podem utilitzar els selectors (classe i DNI) al full d'estil.

Exemple:

 .class { property1 : value1; property2 : value2; property3 : value3; } #id { property1 : value1; property2 : value2; property3 : value3; } 

Avantatges del CSS intern

    CSS internno es pot carregar diversos fitxers quan afegim el codi amb la pàgina HTML.

Contres del CSS intern:

  • Afegint codi al HTML document reduirà el mida de pàgina i temps de càrrega de la pàgina web.

2. CSS extern

En CSS extern, enllacem les pàgines web a les externes .css dossier. Està creat per editor de text . El CSS és un mètode més eficient per dissenyar un lloc web. En editar el .css fitxer, podem canviar tot el lloc alhora.

Per utilitzar el CSS extern, seguiu els passos que s'indiquen a continuació:

1. Creeu un nou .css fitxer amb editor de text , i afegeix Full d'estil en cascada regles també.

Per exemple:

 .xleftcol { float: right; width: 35%; background:#608800; } .xmiddlecol { float: right; width: 35%; background:#eff3df; } 

2. Afegiu una referència a l'exterior .css fitxer just després etiqueta a la secció de Full HTML :

 

Avantatges de CSS extern:

  • Els nostres fitxers tenen una estructura més neta i de mida més petita.
  • Utilitzem el mateix .css fitxer per a diverses pàgines web en CSS extern.

Contres de CSS extern:

  • Les pàgines no es poden lliurar correctament abans de carregar el CSS extern.
  • En CSS extern, la càrrega de molts fitxers CSS pot augmentar el temps de descàrrega d'un lloc web.

3. CSS en línia

CSS en línia s'utilitza per dissenyar un estil específic HTML element. Afegeix a estil atribut a cada etiqueta HTML sense utilitzar els selectors. La gestió d'un lloc web pot ser difícil si només fem servir CSS en línia . Tanmateix, Inline CSS en HTML és útil en algunes situacions. No tenim accés al Fitxers CSS o per aplicar estils a l'element.

A l'exemple següent, hem utilitzat el CSS en línia a

java afegir a una matriu
i

Aquí serà útil.

Avantatges del CSS en línia:

  • Podem crear regles CSS a la pàgina HTML.
  • No podem crear i penjar un document separat en CSS en línia.

Contres de CSS en línia:

  • CSS en línia, afegint CSS regles als elements HTML és que consumeix temps i embolics augmentar l'estructura HTML.
  • Estil diversos elements al mateix temps que poden afectar la mida de la pàgina i el temps de descàrrega de la pàgina.