Le 50 migliori domande e risposte all'intervista CSS (2025)

Ecco le domande e le risposte al colloquio CSS (CSS3) per matricole e candidati esperti per ottenere il lavoro dei loro sogni.

Download gratuito del PDF: domande dell'intervista CSS

1. Cos'è il CSS?

La forma completa dei CSS è Cascading Style Sheets. È un linguaggio di stile abbastanza semplice per HTML elementi. È popolare nella progettazione web e la sua applicazione è comune anche in XHTML.

---

2. Qual è l'origine dei CSS?

Il linguaggio di markup generalizzato standard ha segnato l'inizio dei fogli di stile negli anni '1980.

---

3. Quali sono le diverse varianti dei CSS?

Le varianti per i CSS sono:

• CSS 1
• CSS 2
• CSS 2.1
• CSS 3
• CSS 4

---

4. Quali sono i limiti dei CSS?

Le limitazioni sono:

•  Non è possibile salire tramite selettori
• Limitazioni del controllo verticale
• Nessuna espressione
• Nessuna dichiarazione di colonna
• Pseudo-classe non controllata dal comportamento dinamico
• Regole, stili e targeting di testi specifici non sono possibili

---

5. Quali sono i vantaggi dei CSS?

I vantaggi sono:

• Larghezza di banda
• Coerenza a livello di sito
• Riformattazione della pagina
• Accessibilità
• Contenuto separato dalla presentazione

---

6. Cosa sono i framework CSS?

Si tratta di librerie pre-programmate, che consentono uno stile di pagina Web più semplice e più conforme agli standard, utilizzando il linguaggio CSS.

---

7. Come possono essere centrati gli elementi dei blocchi con i CSS1?

Gli elementi a livello di blocco possono essere centrati da:

Le proprietà margin-left e margin-right possono essere impostate su un valore esplicito:

BODY {

width: 40em;

background: fluorescent;

}

P {

width: 30em;

margin-right: auto;

margin-left: auto

}

In questo caso, i margini sinistro e destro saranno larghi ciascuno cinque em poiché dividono i dieci em rimasti da (40em-30em). Non era necessario impostare una larghezza esplicita per l'elemento BODY; è stato fatto qui per semplicità.

---

8. Chi mantiene le specifiche CSS?

Il World Wide Web Consortium mantiene le specifiche CSS.

---

9. In quanti modi un CSS può essere integrato come una pagina web?

I CSS possono essere integrati in tre modi:

• Inline: l'attributo Style può essere utilizzato per applicare elementi HTML CSS.
• Incorporato: l'elemento Head può avere un elemento Style all'interno del quale è possibile inserire il codice.
• Collegato/importato: i CSS possono essere inseriti in un file esterno e collegati tramite l'elemento collegamento.

---

10. Quali vantaggi e demeriti hanno i fogli di stile esterni?

Vantaggi:

• Un file può essere utilizzato per controllare più documenti con stili diversi.
• Più elementi HTML possono avere molti documenti, che possono avere classi.
• Per raggruppare gli stili in situazioni composite, vengono utilizzati metodi come selettore e raggruppamento.

demeriti:

• È necessario un download aggiuntivo per importare documenti con informazioni sullo stile.
• Per eseguire il rendering del documento, è necessario caricare il foglio di stile esterno.
• Non pratico per piccole definizioni di stile.

---

11. Discutere i meriti e i demeriti dei fogli di stile incorporati?

Meriti dei fogli di stile incorporati:

• È possibile creare più tipi di tag in un singolo documento.
• Gli stili, in situazioni complesse, possono essere applicati utilizzando i metodi Selettore e Raggruppamento.
• Il download aggiuntivo non è necessario.

Demeriti dei fogli di stile incorporati:

• Non è possibile controllare più documenti.

---

12. Cosa significa selettore CSS?

Una stringa equivalente agli elementi HTML con cui vengono dichiarate le dichiarazioni o un insieme di esse ed è un collegamento a cui è possibile fare riferimento per collegare HTML e il foglio di stile è il selettore CSS.

---

13. Elenca i tipi di media consentiti dai CSS?

La progettazione e la personalizzazione dei documenti sono rese dai media. Applicando il controllo multimediale sui fogli di stile esterni, questi possono essere recuperati e utilizzati caricandoli dalla rete.

---

14. Differenziare i tag logici dai tag fisici?

• Mentre i tag fisici vengono anche definiti markup di presentazione, i tag logici sono inutili per le apparenze.
• I tag fisici sono versioni più recenti mentre i tag logici sono vecchi e si concentrano sul contenuto.

---

15. Differenziare il concetto di foglio di stile dall'HTML?

Sebbene l'HTML fornisca un metodo di struttura semplice, manca di stile, a differenza dei fogli di stile. Inoltre, i fogli di stile hanno migliori capacità del browser e opzioni di formattazione.

---

16. Descrivi il "insieme di regole"?

Set di regole: i selettori possono essere collegati ad altri selettori per essere identificati dal set di regole.

Ha due parti:

• Selettore, ad esempio R e
• dichiarazione {text-indent: 11pt}

---

17. Commento sulla distinzione tra maiuscole e minuscole dei CSS?

Sebbene non vi sia distinzione tra maiuscole e minuscole per i CSS, tuttavia lo sono le famiglie di caratteri, gli URL delle immagini, ecc. Solo quando XML nella pagina vengono utilizzate dichiarazioni insieme a XHTML DOCTYPE, i CSS fanno distinzione tra maiuscole e minuscole.

---

18. Definire il blocco Dichiarazione?

Un catalogo di direzioni racchiuse tra parentesi graffe costituite da proprietà, due punti e valore è chiamato blocco di dichiarazione.
es: [proprietà 1: valore 3]

---

19. Elenca gli attributi dei vari caratteri?

Essi sono:

• Stile carattere
• Variante del carattere
• Peso del carattere
• Dimensione carattere/altezza riga
• Famiglia di font
• Didascalia
• Icona

 

---

20. Perché è facile inserire un file importandolo?

L'importazione permette di unire fogli esterni da inserire in più fogli. È possibile utilizzare file e fogli diversi per avere funzioni diverse. Sintassi:

Notazione @import, utilizzata con tag.

---

21. A cosa serve il selettore di classe?

I selettori univoci per uno stile specifico sono chiamati selettori CLASS. In questo modo è possibile effettuare la dichiarazione di stile e l'associazione con HTML. Sintassi:

Nome della classe
può essere AZ, az o cifre.
.top {font: 14em ;}, selettore di classe
questa classe è associata all'elemento

---

22. Differenziare il selettore di classe dal selettore di ID?

Mentre al selettore di classe viene assegnato un blocco complessivo, il selettore ID preferisce solo un singolo elemento diverso dagli altri elementi. In altre parole, gli ID sono univoci mentre le classi no. È possibile che un elemento abbia sia classe che ID.

---

23. È possibile aggiungere più di una dichiarazione nei CSS?

Sì, è possibile ottenerlo utilizzando il punto e virgola.

---

24. Cosa sono gli pseudo-elementi?

Gli pseudo-elementi vengono utilizzati per aggiungere effetti speciali ad alcuni selettori. CSS utilizzato per applicare gli stili nel markup HTML. In alcuni casi, quando per il documento non è possibile aggiungere markup o stili, è disponibile una funzionalità nei CSS nota come pseudo-elementi. Consentirà un markup aggiuntivo al documento senza disturbare il documento reale.

---

25. Come ignorare la sottolineatura dei collegamenti ipertestuali?

Le istruzioni di controllo e i fogli di stile esterni vengono utilizzati per ignorare la sottolineatura dei collegamenti ipertestuali.

Per esempio:

B {

text-decoration: none;

}

<B href="career.html" style="text-decoration: none">link text</B>

 

---

26. Cosa succede se viene utilizzata la larghezza del 100% insieme ai float su tutta la pagina?

Durante la dichiarazione float, viene aggiunto 1 pixel ogni volta che viene utilizzato sotto forma di bordo e successivamente è consentito ancora più float.

---

27. È possibile ripristinare il valore predefinito della proprietà tramite CSS? Se sì, come?

Nei CSS, non è possibile ripristinare i vecchi valori a causa della mancanza di valori predefiniti. La proprietà può essere dichiarata nuovamente per ottenere la proprietà predefinita.

---

28. Elenca i vari tipi di media utilizzati?

Supporti diversi hanno proprietà diverse poiché non fanno distinzione tra maiuscole e minuscole.

Essi sono:

• Aural – per sintetizzatori di suoni e parlato
• Stampa: fornisce un'anteprima del contenuto una volta stampato
• Proiezione: proietta il CSS sui proiettori.
• Palmare: utilizza dispositivi portatili.
• Schermo: schermi di computer e laptop.

---

29. Cos'è il CSS Box Model e quali sono i suoi elementi?

Questa casella definisce il design e il layout degli elementi CSS. Gli elementi sono:

Margine: viene mostrata la struttura complessiva dello strato più in alto
Confine: viene mostrata l'opzione di riempimento e contenuto con un bordo attorno. Il colore dello sfondo influisce sul bordo.
Imbottitura: viene visualizzato lo spazio. Il colore dello sfondo influisce sul bordo.
Contenuti: viene mostrato il contenuto effettivo.

---

30. Cos'è il selettore contestuale?

Il selettore utilizzato per selezionare occorrenze speciali di un elemento è chiamato selettore contestuale. Uno spazio separa i singoli selettori. In questo tipo di selettore viene indirizzato solo l'ultimo elemento del modello. Ad esempio: TD P TEXT {colore: blu}

---

31. Confronta i valori RGB con i codici colore esadecimali?

Un colore può essere specificato in due modi:

• Un colore è rappresentato da 6 caratteri, ovvero una codifica colore esadecimale. È una combinazione di numeri e lettere ed è preceduto da #. es: g {colore: #00cjfi}
• Un colore è rappresentato da una miscela di rosso, verde e blu. È inoltre possibile specificare il valore di un colore. es: rgb(r,g,b): in questo tipo i valori possono essere compresi tra i numeri interi 0 e 255. rgb(r%,g%,b%): viene mostrata la percentuale di rosso, verde e blu.

---

32. Definire gli sprite immagine con contesto in CSS?

Quando una serie di immagini viene riunita in un'unica immagine, è nota come "Image Sprites". Poiché il caricamento di ogni immagine su una pagina Web richiede tempo, l'utilizzo degli sprite delle immagini riduce il tempo impiegato e fornisce informazioni rapidamente.

Codifica CSS:

img.add { width: 60px; height: 55px; background: url (image.god) 0 0; }

 

In questo caso viene utilizzata solo la parte necessaria. L'utente può risparmiare tempo e margine sostanziali in questo modo.

---

33. Confronta raggruppamento e nidificazione nei CSS?

Raggruppamento: I selettori possono essere raggruppati aventi gli stessi valori di proprietà e il codice può essere ridotto.
Per esempio :

h1 {

color: blue;

}

h2 {

color: blue;

}

p {

color: blue;

}

 

Dal codice si può vedere che ogni elemento condivide la stessa proprietà. La riscrittura può essere evitata scrivendo ciascun selettore separato da una virgola.

Nidificazione: la specifica di un selettore all'interno di un selettore è detta nidificazione.

P

{

color: red;

text-align: left;

}

.marked

{

background-color: blue;

}

.marked p

{

color: green;

}

 

---

34. Come si può definire la dimensione di un elemento?

Le proprietà delle dimensioni possono essere definite da:

• Altezza
• Altezza massima
• Larghezza massima
• Altezza minima
• Larghezza minima
• Larghezza

---

35. Definire la proprietà float dei CSS?

Grazie alla proprietà float, l'immagine può essere spostata a destra o a sinistra insieme al testo da avvolgere attorno ad essa. Gli elementi prima dell'applicazione di questa proprietà non modificano le relative proprietà.

---

36. Come funziona l'indice Z?

Potrebbe verificarsi una sovrapposizione durante l'utilizzo dei CSS per il posizionamento degli elementi HTML. L'indice Z aiuta a specificare l'elemento sovrapposto. È un numero che può essere positivo o negativo, il valore predefinito è zero.

---

37. Cos'è il grazioso degrado?

Nel caso in cui il componente si guasti, continuerà a funzionare correttamente in presenza di un grazioso degrado. Durante la progettazione di una pagina Web viene utilizzata l'applicazione browser più recente. Poiché non è disponibile per tutti, esiste una funzionalità di base che ne consente l'utilizzo a un pubblico più ampio. Nel caso in cui l'immagine non sia disponibile per la visualizzazione, il testo viene mostrato con il tag alt.

---

38. Cos'è il miglioramento progressivo?

È un'alternativa al grazioso degrado, che si concentra sulla questione del web. La funzionalità è la stessa, ma fornisce un vantaggio in più agli utenti che dispongono della larghezza di banda più recente. Recentemente è stato utilizzato in modo prominente con le connessioni Internet mobili che hanno ampliato la loro base.

---

39. Come si può progettare la compatibilità con le versioni precedenti nei CSS?

I metodi del foglio HTML vengono collaborati con CSS e utilizzati di conseguenza.

---

40. Come si può eliminare lo spazio sotto l'immagine?

Poiché le immagini in quanto elementi in linea vengono trattate come testi, rimane uno spazio vuoto che può essere rimosso:

CSS

img { display: block ; }

 

---

41. Perché @import è solo in alto?

@import è preferibile solo in alto, per evitare qualsiasi regola prioritaria. Generalmente, l'ordine di classificazione viene seguito nella maggior parte dei linguaggi di programmazione come Java, Modula, ecc. In C, # è un esempio evidente di @import in cima.

---

42. Quale tra i seguenti è più precedente: proprietà CSS o procedure HTML?

I CSS hanno più precedenza sulle procedure HTML. I browser che non dispongono del supporto CSS visualizzano gli attributi HTML.

---

43. Cos'è lo stile in linea?

Lo stile Inline in un CSS viene utilizzato per aggiungere stili ai singoli elementi HTML.

---

44. Come possono essere aggiunti commenti nei CSS?

I commenti nei CSS possono essere aggiunti con /* e */.

---

45. Definire il selettore degli attributi?

È definito da un insieme di elementi, valore e sue parti.

---

46. ​​Definire la proprietà?

Uno stile che aiuta a influenzare i CSS. Ad esempio FONT. Hanno valori o proprietà corrispondenti al loro interno, come FONT ha stili diversi come grassetto, corsivo ecc.

---

47. Cos'è il foglio di stile alternativo?

I fogli di stile alternativi consentono all'utente di selezionare lo stile in cui viene visualizzata la pagina utilizzando il menu Visualizza>Stile pagina. Attraverso il foglio di stile alternativo, l'utente può visualizzare più versioni della pagina in base alle proprie esigenze e preferenze.

---

48. Le virgolette sono obbligatorie negli URL?

Le virgolette sono facoltative negli URL e possono essere singole o doppie.

---

49. Cos'è la regola?

La regola, che è applicabile all'intero foglio e non parzialmente, è detta at-rule. È preceduto da @ seguito da AZ, az o 0-9.

---

50. Come si possono collegare i CSS a cascata per mescolarli con il foglio personale dell'utente?

Le proprietà possono essere impostate nelle posizioni consigliate e il documento modificato per i CSS per mescolarlo con il foglio personale dell'utente.

Queste domande dell'intervista ti aiuteranno anche nella tua viva(orale). In ogni settore, l'utilizzo di siti Web e applicazioni Web aumenta di giorno in giorno e i CSS sono una parte essenziale per creare siti Web attraenti. Quindi, c'è un'enorme richiesta di designer UI/UX e Web che abbiano una buona conoscenza dei CSS con HTML.