Top 50 CSS-interviewspørgsmål og -svar (2025)
Her er CSS (CSS3) interviewspørgsmål og svar til friskere såvel som erfarne kandidater til at få deres drømmejob.
Gratis PDF-download: CSS-interviewspørgsmål
1. Hvad er CSS?
Den fulde form for CSS er Cascading Style Sheets. Det er et stylingsprog, som er enkelt nok til HTML elementer. Det er populært inden for webdesign, og dets anvendelse er også almindeligt i XHTML.
2. Hvad er oprindelsen af CSS?
Standard Generalized Markup Language markerede begyndelsen på style sheets i 1980'erne.
3. Hvad er de forskellige varianter af CSS?
Variationerne for CSS er:
- CSS 1
- CSS 2
- CSS 2.1
- CSS 3
- CSS 4
4. Hvad er begrænsningerne ved CSS?
Begrænsninger er:
- Stigning med vælgere er ikke mulig
- Begrænsninger af vertikal kontrol
- Ingen udtryk
- Ingen kolonneerklæring
- Pseudo-klasse ikke styret af dynamisk adfærd
- Regler, stilarter, målretning efter specifik tekst er ikke muligt
5. Hvad er fordelene ved CSS?
Fordele er:
- båndbredde
- Konsistens på hele webstedet
- Omformatering af siden
- Tilgængelighed
- Indhold adskilt fra præsentation
6. Hvad er CSS-frameworks?
Det er et forudplanlagt bibliotek, som tillader nemmere og mere standard-kompatibel webside-styling ved hjælp af CSS-sprog.
7. Hvordan blokelementer kan centreres med CSS1?
Blokniveauelementer kan centreres ved:
Egenskaberne margin-venstre og margin-right kan indstilles til en eller anden eksplicit værdi:
BODY { width: 40em; background: fluorescent; } P { width: 30em; margin-right: auto; margin-left: auto }
I dette tilfælde vil venstre og højre marginer være hver fem ems brede, da de opdeler de ti ems tilovers fra (40em-30em). Det var unødvendigt at opsætte en eksplicit bredde for BODY-elementet; det blev gjort her for nemheds skyld.
8. Hvem vedligeholder CSS-specifikationerne?
World Wide Web Consortium opretholder CSS-specifikationerne.
9. På hvor mange måder kan en CSS integreres som en webside?
CSS kan integreres på tre måder:
- Inline: Style attribut kan bruges til at have CSS anvendt HTML-elementer.
- Indlejret: Head-elementet kan have et Style-element, inden for hvilket koden kan placeres.
- Linket/importeret: CSS kan placeres i en ekstern fil og linkes via linkelement.
10. Hvilke fordele og ulemper har eksterne stylesheets?
Fordele:
- En fil kan bruges til at styre flere dokumenter med forskellige stilarter.
- Flere HTML-elementer kan have mange dokumenter, som kan have klasser.
- For at gruppere stilarter i sammensatte situationer bruges metoder som vælger og gruppering.
ulemper:
- Ekstra download er nødvendig for at importere dokumenter med stilinformation.
- For at gengive dokumentet skal det eksterne typografiark indlæses.
- Ikke praktisk til små stildefinitioner.
11. Diskuter fordele og ulemper ved indlejrede stylesheets?
Fordele ved indlejrede typografiark:
- Flere tagtyper kan oprettes i et enkelt dokument.
- Styles i komplekse situationer kan anvendes ved at bruge Selector og Grouping metoder.
- Ekstra download er unødvendig.
Ulemper ved indlejrede typografiark:
- Flere dokumenter kan ikke kontrolleres.
12. Hvad betyder CSS-vælger?
En streng, der svarer til HTML-elementer, hvormed erklæringer eller et sæt af det, er deklareret, og er et link, der kan henvises til at linke HTML og typografiark er CSS-vælgeren.
13. Få de medietyper CSS tillader?
Design og tilpasning af dokumenter gengives af medier. Ved at anvende mediekontrol over de eksterne typografiark kan de hentes og bruges ved at indlæse det fra netværket.
14. Differentiere logiske tags fra fysiske tags?
- Mens fysiske tags også omtales som præsentationsmark-up, er logiske tags ubrugelige til udseende.
- Fysiske tags er nyere versioner, mens logiske tags er gamle og koncentrerer sig om indhold.
15. Differentiere Style Sheet koncept fra HTML?
Mens HTML giver en nem strukturmetode, mangler den styling, i modsætning til typografiark. Desuden har typografiark bedre browserfunktioner og formateringsmuligheder.
16. Beskriv 'regelsæt'?
Regelsæt: Vælgere kan knyttes til andre vælgere for at blive identificeret ved regelsæt.
Den har to dele:
- Vælger, f.eks. R og
- erklæring {text-indent: 11pt}
17. Kommentar til case-sensitiviteten af CSS?
Selvom der ikke er store og små bogstaver i CSS, er der ikke desto mindre skrifttypefamilier, URL'er på billeder osv. Kun hvornår XML erklæringer sammen med XHTML DOCTYPE bliver brugt på siden, CSS skelner mellem store og små bogstaver.
18. Definer erklæringsblok?
Et katalog over retninger inden for klammeparenteser bestående af egenskab, kolon og værdi kaldes deklarationsblok.
fx: [egenskab 1: værdi 3]
19. Få de forskellige skrifttypers egenskaber?
De er:
- Skrifttype
- Font-variant
- Font-vægt
- Skriftstørrelse/linjehøjde
- Font-familie
- Caption
- ikon
20. Hvorfor er det nemt at indsætte en fil ved at importere den?
Importering gør det muligt at kombinere eksterne ark, der kan indsættes i mange ark. Forskellige filer og ark kan bruges til at have forskellige funktioner. Syntaks:
@import notation, brugt med tag.
21. Hvad er brugen af Klassevælger?
Vælgere, der er unikke for en bestemt stilart, kaldes CLASS-vælgere. Deklaration af stil og tilknytning til HTML kan laves herigennem. Syntaks:
Klassenavn
det kan være AZ, az eller cifre.
.top {font: 14em ;}, klassevælger
denne klasse er forbundet med element
22. Skelne klassevælger fra ID-vælger?
Mens der gives en samlet blok til klassevælgeren, foretrækker ID-vælgeren kun et enkelt element, der adskiller sig fra andre elementer. Med andre ord er ID unikke, mens klasser ikke er det. Det er muligt, at et element har både klasse og ID.
23. Kan der tilføjes mere end én erklæring i CSS?
Ja, det kan opnås ved at bruge et semikolon.
24. Hvad er Pseudo-elementer?
Pseudo-elementer bruges til at tilføje specielle effekter til nogle vælgere. CSS bruges til at anvende typografier i HTML-mark-up. I nogle tilfælde, hvor ekstra mark-up eller styling ikke er mulig for dokumentet, er der en funktion tilgængelig i CSS kendt som pseudo-elementer. Det vil tillade ekstra mark-up til dokumentet uden at forstyrre det faktiske dokument.
25. Hvordan tilsidesætter man understregede hyperlinks?
Kontroludsagn og eksterne typografiark bruges til at tilsidesætte understregnings-hyperlinks.
F.eks:
B { text-decoration: none; } <B href="career.html" style="text-decoration: none">link text</B>
26. Hvad sker der, hvis der bruges 100 % bredde sammen med flydere over hele siden?
Mens du laver float-deklarationen, tilføjes 1 pixel hver gang den bruges i form af grænsen, og endnu mere float er tilladt derefter.
27. Kan standardegenskabsværdien gendannes gennem CSS? Hvis ja, hvordan?
I CSS kan du ikke vende tilbage til gamle værdier på grund af manglende standardværdier. Egenskaben kan generklæres for at få standardegenskaben.
28. Få de forskellige medietyper brugt?
Forskellige medier har forskellige egenskaber, da de er ufølsomme for store og små bogstaver.
De er:
- Aural – til lydsynthesizere og tale
- Udskriv – giver et eksempel på indholdet, når det udskrives
- Projektion - projicerer CSS'en på projektorer.
- Håndholdt - bruger håndholdte enheder.
- Skærm- computere og bærbare skærme.
29. Hvad er CSS Box Model, og hvad er dens elementer?
Denne boks definerer design og layout af elementer i CSS. Elementerne er:
Margin: det øverste lag, den overordnede struktur er vist
Border: Udfyldnings- og indholdsindstillingen med en kant rundt om vises. Baggrundsfarven påvirker rammen.
Polstring: Mellemrum vises. Baggrundsfarven påvirker rammen.
Indhold: Faktisk indhold vises.
30. Hvad er kontekstuel selektor?
Vælger, der bruges til at vælge særlige forekomster af et element, kaldes kontekstvælger. Et mellemrum adskiller de enkelte vælgere. Kun det sidste element i mønsteret behandles i denne type vælger. For eksempel: TD P TEKST {farve: blå}
31. Sammenlign RGB-værdier med hexadecimale farvekoder?
En farve kan angives på to måder:
- En farve er repræsenteret med 6 tegn, dvs. hexadecimal farvekodning. Det er en kombination af tal og bogstaver med # foran. f.eks.: g {farve: #00cjfi}
- En farve er repræsenteret af en blanding af rød, grøn og blå. Værdien af en farve kan også angives. fx: rgb(r,g,b): I denne type kan værdierne ligge mellem heltal 0 og 255. rgb(r%,g%,b%): rød, grøn og blå procentdel vises.
32. Definer billedsprites med kontekst til CSS?
Når et sæt billeder samarbejdes til ét billede, er det kendt som 'Image Sprites'. Da indlæsning af hvert billede på en webside bruger tid, mindsker brugen af billedsprites den tid, det tager, og giver hurtigt information.
CSS-kodning:
img.add { width: 60px; height: 55px; background: url (image.god) 0 0; }
I dette tilfælde bruges kun den nødvendige del. Brugeren kan spare betydelig margin og tid herigennem.
33. Sammenlign gruppering og indlejring i CSS ?
Gruppering: Vælgere kan grupperes med de samme egenskabsværdier og koden reduceres.
Fx:
h1 { color: blue; } h2 { color: blue; } p { color: blue; }
Det kan ses af koden, at hvert element deler den samme egenskab. Genskrivning kan undgås ved at skrive hver vælger adskilt af et komma.
Indlejring: Angivelse af en vælger i en vælger kaldes indlejring.
P { color: red; text-align: left; } .marked { background-color: blue; } .marked p { color: green; }
34. Hvordan kan dimensionen defineres for et element?
Dimensionsegenskaber kan defineres ved:
- Højde
- Max-højde
- Max bredde
- Min-højde
- Min bredde
- Bredde
35. Definer float-egenskab for CSS?
Ved float-egenskab kan billedet flyttes til højre eller venstre sammen med teksten, der skal pakkes rundt om det. Elementer, før denne egenskab anvendes, ændrer ikke deres egenskaber.
36. Hvordan fungerer Z-indeks?
Overlapning kan forekomme, mens du bruger CSS til positionering af HTML-elementer. Z-indeks hjælper med at specificere det overlappende element. Det er et tal, der kan være positivt eller negativt, og standardværdien er nul.
37. Hvad er yndefuld nedbrydning?
I tilfælde af at komponenten fejler, vil den fortsætte med at fungere korrekt i nærvær af en yndefuld nedbrydning. Den seneste browserapplikation bruges, når en webside er designet. Da det ikke er tilgængeligt for alle, er der en grundlæggende funktionalitet, som gør det muligt at bruge det til et bredere publikum. Hvis billedet ikke er tilgængeligt til visning, vises teksten med alt-tagget.
38. Hvad er progressiv forbedring?
Det er et alternativ til yndefuld nedbrydning, som koncentrerer sig om nettet. Funktionaliteten er den samme, men den giver en ekstra fordel til brugere med den nyeste båndbredde. Det har været i fremtrædende brug for nylig med mobile internetforbindelser, der udvider deres base.
39. Hvordan kan bagudkompatibilitet designes i CSS?
HTML-arkmetoder samarbejdes med CSS og bruges i overensstemmelse hermed.
40. Hvordan kan hullet under billedet fjernes?
Da billeder, der er inline-elementer, behandles på samme måde som tekster, så er der et hul tilbage, som kan fjernes ved at:
CSS
img { display: block ; }
41. Hvorfor er @import kun øverst?
@import foretrækkes kun øverst for at undgå overordnede regler. Generelt følges rangorden i de fleste programmeringssprog som Java, Modula osv. I C er # et fremtrædende eksempel på, at en @import er øverst.
42. Hvilket af følgende er mere præcedens: CSS-egenskaber eller HTML-procedurer?
CSS er mere præcedens end HTML-procedurer. Browsere, som ikke har CSS-understøttelse, viser HTML-attributter.
43. Hvad er Inline-stil?
Inline-stilen i en CSS bruges til at tilføje styling til individuelle HTML-elementer.
44. Hvordan kan kommentarer tilføjes i CSS?
Kommentarerne i CSS kan tilføjes med /* og */.
45. Definer attributvælger ?
Det er defineret af et sæt af elementer, værdi og dets dele.
46. Definer ejendom?
En stil, der hjælper med at påvirke CSS. Fx FONT. De har tilsvarende værdier eller egenskaber i sig, ligesom FONT har en anden stil som fed, kursiv osv.
47. Hvad er Alternativt Style Sheet?
Alternative typografiark giver brugeren mulighed for at vælge den typografi, som siden skal vises i, ved hjælp af menuen Vis>sidetypografi. Gennem Alternativt Style Sheet kan brugeren se flere versioner af siden på deres behov og præferencer.
48. Er citater obligatoriske i URL'er?
Citater er valgfrie i URL'er, og det kan være enkelt eller dobbelt.
49. Hvad er at-rule?
Regel, som er gældende i hele arket og ikke delvist, er kendt som at-rule. Den er indledt af @ efterfulgt af AZ, az eller 0-9.
50. Hvordan kan CSS kombineres til at blandes med brugerens personlige ark?
Egenskaber kan være et sæt anbefalede steder, og dokumentet kan ændres til CSS, så det blandes med brugerens personlige ark.
Disse interviewspørgsmål vil også hjælpe i din viva(orals). I alle brancher stiger brugen af hjemmesider og webapplikationer dag for dag, og CSS er en væsentlig del for at bygge attraktive hjemmesider. Så der er en enorm efterspørgsel efter UI/UX og webdesignere med et godt kendskab til CSS med HTML.
ufuldstændige oplysninger, hvis du vil give svar gør det klart. Denne form for spørgsmål interviewer dosent aks!!.
Tak meget nyttig information
Alle teoretiske spørgsmål ville have været bedre, hvis du også kunne give et par praktiske eksempelbaserede spørgsmål.
Nedenstående svar er ufuldstændigt
"22. Skelner klassevælger fra ID-vælger?
Mens der gives en samlet blok til klassevælgeren, foretrækker ID-vælgeren kun et enkelt element, der adskiller sig fra andre elementer."
Jeg sætter pris på den store indsats.
Tak
Svar er opdateret
Fantastisk indlæg! Hav en god dag! :)
Plz definer float, baggrundsbevægelsesbillede og se clip tag-element i CSS.
Tak
Af ashish
Tak fordi du klippede det er fantastisk. Skriv venligst mere om dette emne..
Hej sir, min liveserver fungerer ikke godt. Jeg klikker på knappen "Kør" for at arbejde med mit projekt, og det virker. Hovedproblemet er, at hvis jeg ændrer noget i tags eller ord, kan jeg ikke køre mit projekt. Kun hvis Jeg stopper den live server og kører den, det virker igen. Jeg ved ikke, hvordan jeg skal håndtere det. Hvis du har tid, så svar venligst på mit spørgsmål. Tak.
Mange tak for et godt spørgsmål