Podcast
Questions and Answers
Quin és el principal propòsit de CSS en el desenvolupament web?
Quin és el principal propòsit de CSS en el desenvolupament web?
- Controlar la presentació i l'estil visual d'un document HTML (correct)
- Gestionar la lògica del servidor
- Definir l'estructura del document HTML
- Executar animacions complexes al navegador
Quina de les següents opcions descriu millor com CSS facilita la separació de contingut i presentació en el desenvolupament web?
Quina de les següents opcions descriu millor com CSS facilita la separació de contingut i presentació en el desenvolupament web?
- CSS controla l'aspecte visual, mentre que HTML defineix l'estructura i el contingut. (correct)
- CSS permet incrustar codi JavaScript directament en elements HTML.
- CSS compila el codi HTML en llenguatge màquina per a una execució més ràpida.
- CSS s'encarrega de la lògica del servidor, mentre que HTML gestiona la interacció amb l'usuari.
Com gestiona CSS els conflictes quan múltiples regles d'estil s'apliquen al mateix element?
Com gestiona CSS els conflictes quan múltiples regles d'estil s'apliquen al mateix element?
- CSS segueix un esquema de prioritat on l'última regla definida generalment preval, sobrescrivint les anteriors. (correct)
- CSS soluciona els conflictes aleatòriament.
- CSS aplica totes les regles per igual, combinant els efectes.
- CSS ignora les regles conflictives i utilitza l'estil per defecte del navegador.
Quina és la funció principal dels selectors en CSS?
Quina és la funció principal dels selectors en CSS?
Si un element HTML té tant un estil definit mitjançant una regla inline com un altre definit en una fulla d'estil externa, quin estil s'aplicarà?
Si un element HTML té tant un estil definit mitjançant una regla inline com un altre definit en una fulla d'estil externa, quin estil s'aplicarà?
En quin ordre de prioritat s'apliquen els estils CSS, de menor a major prioritat?
En quin ordre de prioritat s'apliquen els estils CSS, de menor a major prioritat?
Què implica l'ús de regles CSS externes i com millora el manteniment del codi?
Què implica l'ús de regles CSS externes i com millora el manteniment del codi?
Quina és la sintaxi correcta per definir un comentari en CSS?
Quina és la sintaxi correcta per definir un comentari en CSS?
Com s'estructura una regla CSS bàsica per aplicar un estil a un element HTML?
Com s'estructura una regla CSS bàsica per aplicar un estil a un element HTML?
Quina és la diferència principal entre un selector d'ID i un selector de classe a CSS?
Quina és la diferència principal entre un selector d'ID i un selector de classe a CSS?
Quin dels següents selectors CSS és utilitzat per seleccionar un element amb un ID específic?
Quin dels següents selectors CSS és utilitzat per seleccionar un element amb un ID específic?
Com pots aplicar un mateix estil a múltiples elements HTML utilitzant CSS?
Com pots aplicar un mateix estil a múltiples elements HTML utilitzant CSS?
Quins tipus de valors poden ser utilitzats per definir el color d'un text en CSS?
Quins tipus de valors poden ser utilitzats per definir el color d'un text en CSS?
Com es defineix el color de fons d'un element HTML utilitzant CSS?
Com es defineix el color de fons d'un element HTML utilitzant CSS?
Si volem definir un color utilitzant el format RGB, quin rang de valors és permès per a cada component (Vermell, Verd, Blau)?
Si volem definir un color utilitzant el format RGB, quin rang de valors és permès per a cada component (Vermell, Verd, Blau)?
Quin format s'utiliza per representar el color vermell en hexadecimal en CSS?
Quin format s'utiliza per representar el color vermell en hexadecimal en CSS?
Quina unitat de mesura en CSS és relativa a la mida de la font actual de l'element?
Quina unitat de mesura en CSS és relativa a la mida de la font actual de l'element?
Quina és la funció de la propietat margin
en CSS?
Quina és la funció de la propietat margin
en CSS?
Com es pot aplicar un marge diferent a cada costat d'un element utilitzant CSS?
Com es pot aplicar un marge diferent a cada costat d'un element utilitzant CSS?
Quina és la diferència entre les propietats margin
i padding
en CSS?
Quina és la diferència entre les propietats margin
i padding
en CSS?
Quina propietat CSS s'utilitza per canviar el tipus de lletra d'un text?
Quina propietat CSS s'utilitza per canviar el tipus de lletra d'un text?
Quina propietat s'utilitza per definir l'alineació horitzontal del text dins d'un element?
Quina propietat s'utilitza per definir l'alineació horitzontal del text dins d'un element?
Quina propietat CSS permet canviar el text a majúscules o minúscules?
Quina propietat CSS permet canviar el text a majúscules o minúscules?
Quines propietats CSS són utilitzades per definir el contorn d'un element?
Quines propietats CSS són utilitzades per definir el contorn d'un element?
Si voleu definir un contorn d'1 píxel, sòlid i de color negre, quina seria la sintaxi correcta?
Si voleu definir un contorn d'1 píxel, sòlid i de color negre, quina seria la sintaxi correcta?
Quina propietat CSS controla la separació vertical entre línies de text?
Quina propietat CSS controla la separació vertical entre línies de text?
Flashcards
Què és CSS?
Què és CSS?
CSS (Cascading Style Sheets) és un llenguatge de fulls d'estil que descriu la presentació d'un document HTML.
Què són regles inline?
Què són regles inline?
Les regles inline defineixen estils directament en elements HTML usant l'atribut 'style'.
Què són regles internes?
Què són regles internes?
Les regles internes defineixen estils dins d'una secció <style> en el mateix document HTML, normalment dins de
.
Què són regles externes?
Què són regles externes?
Signup and view all the flashcards
Selectors i propietats en CSS
Selectors i propietats en CSS
Signup and view all the flashcards
Selectors per nom d'etiqueta
Selectors per nom d'etiqueta
Signup and view all the flashcards
Selectors per ID
Selectors per ID
Signup and view all the flashcards
Selectors per classe
Selectors per classe
Signup and view all the flashcards
Propietats de color en CSS
Propietats de color en CSS
Signup and view all the flashcards
Formats de color en CSS
Formats de color en CSS
Signup and view all the flashcards
Què és RGB?
Què és RGB?
Signup and view all the flashcards
Què és hexadecimal?
Què és hexadecimal?
Signup and view all the flashcards
Unitats de mida en CSS
Unitats de mida en CSS
Signup and view all the flashcards
Margin vs. Padding
Margin vs. Padding
Signup and view all the flashcards
Marges específics
Marges específics
Signup and view all the flashcards
Propietats text
Propietats text
Signup and view all the flashcards
Propietats de contorn en CSS
Propietats de contorn en CSS
Signup and view all the flashcards
Contorn abreujat
Contorn abreujat
Signup and view all the flashcards
Study Notes
Què és el CSS?
- CSS (Cascading Style Sheets) és un llenguatge de fulls d'estil utilitzat per descriure la presentació d'un document HTML.
- CSS facilita separar el contingut (HTML) i la presentació.
- CSS defineix regles amb prioritat per determinar quins estils s'apliquen quan hi ha vàries regles per a un element.
- L'última regla definida té preferència i sobreescriu les anteriors, llevat que s'indiqui el contrari.
Com s'aplica el CSS?
- Hi ha tres maneres d'aplicar CSS a un document HTML: regles inline, internes i externes.
- Les regles inline defineixen els estils directament sobre l'etiqueta HTML.
- Les regles internes es defineixen en una secció a part dins del mateix document HTML.
- Les regles externes es defineixen en un document a part.
Regles Inline
- Les regles inline es defineixen mitjançant l'atribut "style" en les etiquetes HTML.
- Aquestes regles només afecten l'etiqueta on es defineixen.
- Aquest mètode no és recomanable perquè no separa el contingut de la presentació.
Regles Internes
- Les regles internes es defineixen mitjançant l'etiqueta
<style>
, que s'inclou dins de l'etiqueta<head>
d'un document HTML. - Aquestes regles afecten tot el document HTML on s'han definit.
- Aquest mètode millora la separació entre HTML i CSS, però encara estan definits en un mateix fitxer.
Regles Externes
- Les regles externes es defineixen en un document CSS separat del codi HTML (per exemple, style.css).
- El fitxer CSS definit s'ha d'incloure al document HTML.
- Aquest mètode garanteix la separació entre continguts i presentació, sent el mètode recomanat per incloure CSS.
Selectors, Propietats i Valors
- En CSS, es defineix una llista d'instruccions en el format "selector:propietats".
- El selector indica a quines etiquetes afecta la instrucció.
- La llista de propietats conté les regles d'estil que s'han d'aplicar a aquestes etiquetes.
- Cada propietat segueix el format "clau:valor", on la clau és el nom de la propietat i el valor és l'estil que s'ha d'aplicar.
- Les propietats sempre van escrites entre claus ({...}) i després de cada propietat s'ha d'escriure un punt i coma (;).
Tipus de Selectors
- Un selector pot contenir el nom d'una etiqueta, un identificador o una classe.
- El nom d'una etiqueta afecta totes les etiquetes d'aquell tipus.
- Un identificador afecta l'etiqueta HTML que tingui aquell ID.
- Una classe afecta a totes les etiquetes HTML amb aquella classe.
- Es pot fer qualsevol combinació dels tres tipus de selectors.
Tipus de Valors
- Cada propietat s'escriu mitjançant una clau (paraula reservada del llenguatge CSS) i el valor que conté.
- Els valors de les propietats poden ser de diferents tipus: colors, mides, URLs i cadenes de text.
Colors
- Algunes propietats CSS serveixen per definir el color d'un component.
- Exemples inclouen definir el color del text (color: red) o el color de fons (background-color: red).
- Els valors de color poden ser principalment: noms de color, RGB en format decimal i RGB en format hexadecimal.
Nom de Colors
- En CSS hi ha una llista de noms de colors predefinits: per exemple, aqua, black, blue, gray, green, maroon, purple, red, white, yellow.
- També es pot definir el color transparent amb
color: transparent
. - És preferible utilitzar valors exactes de color en format RGB per evitar possibles diferències d'interpretació per part del navegador.
RGB en Format Decimal
- RGB és un format de color que defineix el color usant tres components: R (red), G (green) i B (blue).
- Cada component RGB pot tenir un valor entre 0 i 255.
- El valor 0 representa l'absència de color i 255 la màxima saturació.
- Ex:
color: rgb(255, 0, 0)
RGB en Hexadecimal
- En CSS, el color RGB es pot expressar també en format hexadecimal.
- Hexadecimal és un sistema de numeració en base 16, amb 16 números per comptar: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F.
- En CSS el format seria
color: #ff0000
(255 de vermell, 0 de verd i 0 de blau).
Mides
- Moltes propietats CSS defineixen els seus valors mitjançant mides.
- Les mides es poden expressar en diferents unitats: px (píxels), % (percentatge), em (mida de la font), pt (punt d'impressió).
- No cal especificar la unitat quan un valor és 0.
Marges
- Els marges d'una etiqueta es defineixen principalment amb les propietats "margin" i "padding".
- La propietat "margin" defineix la distància externa, entre l'etiqueta i el que queda a fora.
- La propietat "padding" defineix la distància interna entre l'etiqueta i el seu contingut.
Marges Específics
- Les propietats "margin" i "padding" apliquen el marge especificat a tots els costats de l'etiqueta on s'han definit.
- Per aplicar el marge només a un costat i poder posar marges diferents, es poden definir les propietats: margin-left, margin-right, margin-top, margin-bottom, padding-left, padding-right, padding-top, padding-bottom.
Text
- Les propietats principals per manipular el text en CSS són:
- font-family: Tipus de font.
- font-size: Mida de la font.
- font-weight: Pes de la font (de fina a negreta).
- font-style: Normal o cursiva.
- text-decoration: Línia decorativa (subratllat).
- text-transform: Conversió a majúscules o minúscules.
- line-height: Separació entre línies.
- text-align: Alineació del text.
Contorns
- Es pot definir un contorn a la majoria d'elements HTML mitjançant les següents propietats:
- border-width: Amplada del contorn.
- border-style: Tipus de contorn.
- border-color: Color del contorn.
- També es poden definir totes juntes, on la propietat border inclou els valors de las tres propietats anteriors separats per espais en blanc. Ex:
border: 2px solid red;
Studying That Suits You
Use AI to generate personalized quizzes and flashcards to suit your learning preferences.