Topp 50 CSS-intervjufrågor och svar (2025)
Här är CSS (CSS3) intervjufrågor och svar för nybörjare såväl som erfarna kandidater för att få sitt drömjobb.
Gratis PDF-nedladdning: CSS-intervjufrågor
1. Vad är CSS?
Den fullständiga formen av CSS är Cascading Style Sheets. Det är ett stylingspråk som är tillräckligt enkelt för html element. Det är populärt inom webbdesign, och dess tillämpning är också vanlig i XHTML.
2. Vad är ursprunget till CSS?
Standard Generalized Markup Language markerade början av stilmallar på 1980-talet.
3. Vilka är de olika varianterna av CSS?
Variationerna för CSS är:
- CSS 1
- CSS 2
- CSS 2.1
- CSS 3
- CSS 4
4. Vilka är begränsningarna för CSS?
Begränsningar är:
- Det är inte möjligt att stiga med väljare
- Begränsningar av vertikal kontroll
- Inga uttryck
- Ingen kolumndeklaration
- Pseudoklass styrs inte av dynamiskt beteende
- Regler, stilar, inriktning på specifik text är inte möjligt
5. Vilka är fördelarna med CSS?
Fördelarna är:
- Bandbredd
- Konsistens över hela webbplatsen
- Omformatering av sidan
- Tillgänglighet
- Innehåll skilt från presentation
6. Vad är CSS-ramverk?
Det är ett förplanerat bibliotek, som möjliggör enklare och mer standardkompatibel webbsidastyling med hjälp av CSS-språk.
7. Hur blockelement kan centreras med CSS1?
Blocknivåelement kan centreras av:
Egenskaperna marginal-vänster och marginal-höger kan ställas in på något explicit värde:
BODY { width: 40em; background: fluorescent; } P { width: 30em; margin-right: auto; margin-left: auto }
I det här fallet kommer vänster och höger marginaler att vara vardera, fem ems breda eftersom de delar upp de tio ems som blir över från (40em-30em). Det var onödigt att ställa in en explicit bredd för BODY-elementet; det gjordes här för enkelhetens skull.
8. Vem underhåller CSS-specifikationerna?
World Wide Web Consortium upprätthåller CSS-specifikationerna.
9. På hur många sätt kan en CSS integreras som en webbsida?
CSS kan integreras på tre sätt:
- Inline: Style-attribut kan användas för att ha CSS-applicerade HTML-element.
- Inbäddat: Head-elementet kan ha ett Style-element inom vilket koden kan placeras.
- Länkad/ Importerad: CSS kan placeras i en extern fil och länkas via länkelement.
10. Vilka fördelar och nackdelar har Externa Style Sheets?
Fördelar:
- En fil kan användas för att styra flera dokument med olika stilar.
- Flera HTML-element kan ha många dokument, som kan ha klasser.
- För att gruppera stilar i sammansatta situationer används metoder som väljare och gruppering.
svagheter:
- Extra nedladdning behövs för att importera dokument med stilinformation.
- För att rendera dokumentet bör den externa stilmallen laddas.
- Inte praktiskt för små stildefinitioner.
11. Diskutera fördelarna och nackdelarna med Embedded Style Sheets?
Fördelarna med inbäddade formatmallar:
- Flera taggtyper kan skapas i ett enda dokument.
- Stilar, i komplexa situationer, kan tillämpas med hjälp av väljare och grupperingsmetoder.
- Extra nedladdning är onödig.
Nackdelar med inbäddade formatmallar:
- Flera dokument kan inte kontrolleras.
12. Vad betyder CSS-väljare?
En strängekvivalent med HTML-element genom vilka deklarationer eller en uppsättning av den deklareras och är en länk som kan hänvisas för att länka HTML och formatmall är CSS-väljaren.
13. Anlita de mediatyper som CSS tillåter?
Design och anpassning av dokument återges av media. Genom att tillämpa mediekontroll över de externa stilmallarna kan de hämtas och användas genom att ladda dem från nätverket.
14. Skiljer logiska taggar från fysiska taggar?
- Även om fysiska taggar också kallas presentationsmarkering, är logiska taggar värdelösa för utseenden.
- Fysiska taggar är nyare versioner medan logiska taggar är gamla och koncentrerar sig på innehåll.
15. Skiljer stilmallskonceptet från HTML?
Även om HTML ger en enkel strukturmetod, saknar den stil, till skillnad från stilmallar. Dessutom har stilmallar bättre webbläsarfunktioner och formateringsalternativ.
16. Beskriv 'regeluppsättning'?
Regeluppsättning: Väljare kan kopplas till andra väljare för att identifieras av regeluppsättningen.
Den har två delar:
- Väljare, t.ex. R och
- deklaration {text-indent: 11pt}
17. Kommentar om skiftlägeskänslighet för CSS?
Även om det inte finns någon skiftlägeskänslighet för CSS, men teckensnittsfamiljer, webbadresser till bilder osv. Bara när XML deklarationer tillsammans med XHTML DOCTYPE används på sidan, CSS är skiftlägeskänslig.
18. Definiera deklarationsblock?
En katalog med anvisningar inom klammerparenteser som består av egenskap, kolon och värde kallas deklarationsblock.
t.ex.: [egenskap 1: värde 3]
19. Anlita de olika typsnittens attribut?
De är:
- Typsnitt
- Typsnittsvariant
- Fontvikt
- Teckenstorlek/radhöjd
- Typsnittsfamilj
- Bildtext
- icon
20. Varför är det lätt att infoga en fil genom att importera den?
Importering gör det möjligt att kombinera externa ark som kan infogas i många ark. Olika filer och ark kan användas för att ha olika funktioner. Syntax:
@import notation, används med tag.
21. Vad är användningen av Klassväljare?
Väljare som är unika för en specifik stil kallas CLASS-väljare. Deklaration av stil och association med HTML kan göras genom detta. Syntax:
Klassnamn
det kan vara AZ, az eller siffror.
.top {font: 14em ;}, klassväljare
denna klass är associerad med element
22. Skiljer klassväljare från ID-väljare?
Medan ett övergripande block ges till klassväljaren, föredrar ID-väljaren endast ett enda element som skiljer sig från andra element. Med andra ord är ID unika medan klasser inte är det. Det är möjligt att ett element har både klass och ID.
23. Kan mer än en deklaration läggas till i CSS?
Ja, det kan uppnås genom att använda semikolon.
24. Vad är Pseudo-element?
Pseudo-element används för att lägga till specialeffekter till vissa väljare. CSS används för att tillämpa stilar i HTML-uppmärkning. I vissa fall när extra uppmärkning eller stil inte är möjlig för dokumentet, finns det en funktion tillgänglig i CSS som kallas pseudoelement. Det kommer att tillåta extra markering till dokumentet utan att störa det faktiska dokumentet.
25. Hur åsidosätter man understrukna hyperlänkar?
Kontrollsatser och externa stilmallar används för att åsidosätta understrukna hyperlänkar.
T.ex:
B { text-decoration: none; } <B href="career.html" style="text-decoration: none">link text</B>
26. Vad händer om 100 % bredd används tillsammans med flyter över hela sidan?
När floatdeklarationen görs läggs 1 pixel till varje gång den används i form av gränsen, och ännu mer float tillåts därefter.
27. Kan standardegenskapsvärdet återställas via CSS? Om ja, hur?
I CSS kan du inte återgå till gamla värden på grund av brist på standardvärden. Egenskapen kan omdeklareras för att få standardegenskapen.
28. Anlita de olika mediatyper som används?
Olika medier har olika egenskaper eftersom de är skiftlägesokänsliga.
De är:
- Aural – för ljudsyntar och tal
- Skriv ut – ger en förhandsvisning av innehållet när det skrivs ut
- Projektion - projicerar CSS på projektorer.
- Handhållen - använder handhållna enheter.
- Skärm- datorer och bärbara skärmar.
29. Vad är CSS Box Model och vilka är dess element?
Denna ruta definierar design och layout av element i CSS. Elementen är:
Marginal: det översta lagret, den övergripande strukturen visas
Border: alternativet utfyllnad och innehåll med en ram runt visas. Bakgrundsfärgen påverkar kanten.
Padding: Mellanslag visas. Bakgrundsfärgen påverkar kanten.
Innehåll: Verkligt innehåll visas.
30. Vad är kontextväljare?
Väljare som används för att välja speciella förekomster av ett element kallas kontextuell väljare. Ett mellanslag skiljer de enskilda väljarna åt. Endast det sista elementet i mönstret adresseras i denna typ av väljare. Till exempel: TD P TEXT {färg: blå}
31. Jämför RGB-värden med hexadecimala färgkoder ?
En färg kan anges på två sätt:
- En färg representeras av 6 tecken, dvs hexadecimal färgkodning. Det är en kombination av siffror och bokstäver och föregås av #. t.ex.: g {färg: #00cjfi}
- En färg representeras av en blandning av rött, grönt och blått. Värdet på en färg kan också anges. t.ex.: rgb(r,g,b): I denna typ kan värdena ligga mellan heltal 0 och 255. rgb(r%,g%,b%): röd, grön och blå procent visas.
32. Definiera bildsprites med kontext till CSS?
När en uppsättning bilder samarbetas till en bild kallas det "Image Sprites". Eftersom inläsningen av varje bild på en webbsida tar tid, minskar användningen av bildsprites tiden och ger information snabbt.
CSS-kodning:
img.add { width: 60px; height: 55px; background: url (image.god) 0 0; }
I detta fall används endast den del som behövs. Användaren kan spara avsevärd marginal och tid genom detta.
33. Jämför gruppering och kapsling i CSS ?
Gruppering: Väljare kan grupperas med samma egenskapsvärden och koden reduceras.
Till exempel:
h1 { color: blue; } h2 { color: blue; } p { color: blue; }
Det kan ses från koden att varje element delar samma egenskap. Omskrivning kan undvikas genom att skriva varje väljare separerade med ett kommatecken.
Kapsling: Att ange en väljare inom en väljare kallas kapsling.
P { color: red; text-align: left; } .marked { background-color: blue; } .marked p { color: green; }
34. Hur kan dimensionen definieras för ett element?
Dimensionsegenskaper kan definieras av:
- Höjd
- Max-höjd
- Max bredd
- Min-höjd
- Min-bredd
- Bredd
35. Definiera float-egenskapen för CSS?
Med float-egenskap kan bilden flyttas till höger eller vänster tillsammans med texten som ska lindas runt den. Element innan den här egenskapen tillämpas ändrar inte deras egenskaper.
36. Hur fungerar Z-index?
Överlappning kan inträffa när CSS används för att placera HTML-element. Z-index hjälper till att specificera det överlappande elementet. Det är ett tal som kan vara positivt eller negativt, standardvärdet är noll.
37. Vad är graciös nedbrytning?
Om komponenten misslyckas kommer den att fortsätta att fungera korrekt i närvaro av en graciös nedbrytning. Den senaste webbläsarapplikationen används när en webbsida designas. Eftersom det inte är tillgängligt för alla finns det en grundläggande funktionalitet som gör att den kan användas för en bredare publik. Om bilden inte är tillgänglig för visning visas text med alt-taggen.
38. Vad är progressiv förbättring?
Det är ett alternativ till graciös nedbrytning, som koncentrerar sig på frågan om nätet. Funktionaliteten är densamma, men den ger en extra fördel för användare som har den senaste bandbredden. Det har varit i framstående användning nyligen med mobila internetanslutningar som utökar sin bas.
39. Hur kan bakåtkompatibilitet utformas i CSS?
HTML-arkmetoder samarbetas med CSS och används därefter.
40. Hur kan gapet under bilden tas bort?
Eftersom bilder som är inline-element behandlas på samma sätt som texter, så finns det en lucka kvar som kan tas bort genom att:
CSS
img { display: block ; }
41. Varför är @import bara överst?
@import föredras endast överst, för att undvika överordnade regler. I allmänhet följs rankningsordning i de flesta programmeringsspråk som Java, Modula, etc. I C är # ett framträdande exempel på att en @import är överst.
42. Vilket av följande är mer prejudikat: CSS-egenskaper eller HTML-procedurer?
CSS är mer prejudikat än HTML-procedurer. Webbläsare, som inte har CSS-stöd, visar HTML-attribut.
43. Vad är Inline-stil?
Inline-stilen i en CSS används för att lägga till stil till enskilda HTML-element.
44. Hur kan kommentarer läggas till i CSS?
Kommentarerna i CSS kan läggas till med /* och */.
45. Definiera attributväljare?
Det definieras av en uppsättning element, värde och dess delar.
46. Definiera egendom?
En stil som hjälper till att påverka CSS. T.ex. FONT. De har motsvarande värden eller egenskaper inom sig, som FONT har olika stil som fetstil, kursiv etc.
47. Vad är alternativ stilmall?
Alternativa formatmallar låter användaren välja den stil som sidan ska visas i med hjälp av menyn Visa>Sidformat. Genom alternativ stilmall kan användaren se flera versioner av sidan på deras behov och preferenser.
48. Är citattecken obligatoriska i URL:er?
Citat är valfria i URL:er, och det kan vara enkla eller dubbla.
49. Vad är at-rule?
Regel, som är tillämplig i hela arket och inte delvis, kallas at-rule. Den föregås av @ följt av AZ, az eller 0-9.
50. Hur kan CSS kombineras för att blandas med användarens personliga ark?
Egenskaper kan vara en uppsättning på rekommenderade platser och dokumentet kan modifieras för CSS för att blandas med användarens personliga ark.
Dessa intervjufrågor kommer också att hjälpa dig i din viva(orals). I alla branscher ökar användningen av webbplatser och webbapplikationer dag för dag, och CSS är en viktig del för att bygga attraktiva webbplatser. Så det finns en stor efterfrågan på UI/UX och webbdesigners som har goda kunskaper om CSS med HTML.
ofullständig information om du ska ge svar gör det tydligt. Denna typ av frågor intervjuaren dosent aks!!.
Tack mycket användbar information
Alla teoretiska frågor hade varit bättre om du också kunde ge några praktiska exempelbaserade frågor.
Svaret nedan är ofullständigt
"22. Skiljer klassväljare från ID-väljare?
Medan ett övergripande block ges till klassväljaren, föredrar ID-väljaren endast ett enda element som skiljer sig från andra element."
Jag uppskattar den stora insatsen.
Tack
Svaret är uppdaterat
Bra inlägg! Ha en bra dag! :)
Snälla definiera flytande, rörlig bakgrundsbild och titta på clip tag-element i CSS.
Tack
Av ashish
Tack för att du sa det är fantastiskt. Skriv mer om detta ämne..
Hej herre, min liveserver fungerar inte bra. Jag klickar på "Kör"-knappen för att arbeta med mitt projekt och det fungerar. Huvudproblemet är att om jag ändrar något i taggar eller ord kan jag inte köra mitt projekt. Jag stoppar den liveservern och kör den, den fungerar igen. Jag vet inte hur jag ska hantera det. Om du har tid, svara gärna på min fråga. Tack.
Tack så mycket för bra frågeställning