Die häufigsten Fragen über CSS im Vorstellungsgespräch.
Damit eine Firma erfolgreich ist, benötigt sie Experten aus vielen verschiedenen Berufsfeldern. Dazu gehören Programmierer, Designer, Autoren und Marketingspezialisten. Auf dem Arbeitsmarkt werden mittlerweile CSS-Designer immer häufiger angefragt. Dadurch ergeben sich auch beim Jobinterview immer mehr Fragen zum Thema CSS. Daher wollen wir im Folgenden die häufigsten CSS-bezogenen Fragen ausführen.
Wir werden uns einige CSS-Fragen und die dazugehörigen Antworten ansehen. Diese kannst du dann zur Vorbereitung auf dein Vorstellungsgespräch studieren. Dabei werden wir alle Aspekte von CSS bis zu CSS3 betrachten.
Der erste Teil wird hauptsächlich aus einfacheren und allgemeineren Fragen bestehen. Dies sind üblicherweise Fragen, die beim Interview am Anfang gefragt werden. Hierbei sollst du zeigen, dass du die Grundlagen von CSS gelernt hast.
Wir wollen mit den einfacheren Fragen anfangen:
Frage 1: Was ist CSS?
Cascading Style Sheets (üblicherweise als CSS abgekürzt) ist eine Sprache, die dazu benutzt wird, zu beschreiben wie Elemente, die von sogenannten Markupsprachen (dazu gehört HTML) beschrieben werden, gerendert werden.
Das mag sich erstmal kompliziert anhören, aber im Grunde ist es, wie du gleich sehen wirst, ganz einfach.
CSS beschreibt, wie die Elemente, die durch HTML definiert werden, dargestellt werden. Beispielsweise kann man Text verschiedene Farben zuordnen, die Schriftart festlegen und für Bilder die Größe einstellen.
Übrigens: Viele Arbeitgeber hören beim Interview gern, dass du Dinge in deinen eigenen Worten beschreibst und nicht etwas auswendig gelerntes herunterratterst. Daher solltest du dir immer die einfachsten Definitionen merken!
Frage 2: Was ist der Unterschied zwischen CSS und HTML?
Überraschenderweise kennen erstaunlich viele Leute den Unterschied zwischen diesen Sprachen nicht.
HTML definiert, welche Inhalte auf der Webseite vorhanden sind. CSS bestimmt, wie diese definierten Inhalte aussehen.
Frage 3: Wie kann man CSS auf eine HTML-Seite anwenden?
Es gibt drei verschiedene Möglichkeiten, CSS auf eine HTML-Seite anzuwenden. Die an der häufigsten benutzten Methode ist es, eine externe CSS-Datei über das link-Tag einzubinden. Dadurch kann man das gleiche CSS-File in mehrere HTML-Seiten einbinden.
Alternativ kann man auch das style Attribut verwenden. Dies wird normalerweise gemacht, wenn nur einzelne Elemente gestylt werden sollen.
Eine weitere Möglichkeit ist es, CSS über das style-Tag im Header des HTML-Dokuments zu definieren. Es wird dann auf die gesamte Webseite angewandt.
Frage 4: Wie viele verschiedene Versionen von CSS gibt es?
Insgesamt gibt es fünf verschiedene Versionen von CSS: CSS 1, CSS 2, CSS 2.1, CSS 3 und CSS 4.
Bei den meisten Fragen wird es um CSS 3 gehen, weil es die am meisten eingesetzte Version ist.
Frage 5: Was ist ein CSS-Framework?
Als CSS-Frameworks bezeichnet man Bibliotheken von vorgefertigten CSS-Dateien. Dadurch lassen sich relativ schnell Webseiten erstellen, die dann auf diese vorgefertigten Designs zurückgreifen.
Jetzt kostenlosen Crashkurs sichern (Online Programmieren, keine Installation nötig)
Frage 6: Wie lassen sich HTML-Elemente zur Verwendung von CSS selektieren?
Um CSS auf HTML-Elemente anzuwenden, müssen diese Elemente selektiert werden. Dies kann entweder über Tags, Klassen oder IDs durchgeführt werden. Je nach Art der Selektion kann die Menge der Elemente, auf die ein CSS-Style angewandt wird, variiert werden. Wendet man einen Style auf ein Tag an, wird automatisch dieser Style auf alle Elemente der Seite angewandt, die mit diesem Tag erstellt wurden. Beispielsweise könnte man alle Elemente mit dem Tag h1 über diese Art mit Styles versehen. Klassen und IDs erlauben eine feingranularere Art, Styles auf Elemente anzuwenden.
Frage 7: Wie würde man eine Farbe in CSS definieren?
Es gibt zwei Arten, Farben in CSS zu definieren. Eine Möglichkeit ist der RGB-Code. RGB steht für Red, Green und Blau. Durch Kombination dieser Grundfarben können je nach Anteil der Grundfarbe viele verschiedene Farbtöne erzeugen.
Ein hexadezimaler Farbcode ist ein Code der eine bestimmte Farbe repräsentiert. Diese Codes bestehen aus sechs verschiedenen hexadezimalen Zeichen. Jede Kombination repräsentiert eine andere Farbe.
Frage 8: Was sind Pseudoelemente?
Pseudoelemente sind Elemente, die im HTML-Baum der Seite eigentlich nicht vorhanden sind, sich aber trotzdem über Selektoren auswählen lassen. Kling kompliziert? An diesem Beispiel wird es klar:
Wir wissen, dass Paragraphen Elemente in HTML sind, die wir über ihre Selektoren auswählen können. Das dazugehörige Pseudoelement könnte z.B. der erste Buchstabe des Paragraphen sein. Diesen kannst du ebenso über einen Selektor auswählen. Man selektiert diese Elemente, indem man ihnen einen zweifachen Doppelpunkt vorstellt.
Frage 9: Was sind Pseudoklassen?
Pseudoklassen und Pseudoelemente funktionieren fast identisch. Der hauptsächliche Unterschied ist dass sie das Aussehen eines Elementes ändern, wenn es in einem bestimmten Zustand ist. Beispielsweise lässt sich dadurch ein Element stylen, wenn du mit dem Mauszeiger auf das Element gehst.
Frage 10: Wie kann man CSS in eine Webseite integrieren?
Als letztes Beispiel der Fragen zu den CSS-Grundlagen wollen wir besprechen, wie man CSS in eine Webseite integrieren kann. Dazu gibt es drei Möglichkeiten: inline, embedded und imported.
Die inline-Methode wird dazu benutzt, ein CSS-Stylesheet in ein HTML Dokument zu integrieren. Mit der embedded-Methode kannst du mehrere einzigartige Styles in ein einziges Dokument importieren, während die imported-Methode es ermöglicht, Änderungen in mehreren Dokumenten gleichzeitig durchzuführen.
Kommen wir zu dem Fortgeschrittenen Teil:
Lass dich von dem Wort “Fortgeschrittene“ nicht zu sehr beeindrucken. Es bedeutet einfach, dass bei diesen Fragen von dir meist eine größere Detailtiefe in deiner Antwort erwartet wird. Du sollst damit zeigen, wie gut du dich mit CSS auskennst.
Frage 11: Erkläre das Konzept von „Spezifität“ (engl: specificity)
Diese Frage gehört zu den schwereren Fragen zum Thema CSS weil es sein kann, dass dein Interviewpartner nicht nur Spezifität an sich erklärt haben möchte sondern auch Priorität einzelner Elemente.
Das Konzept beschreibt einfach, dass sich CSS-Elemente überschreiben können. Je nach Priorität erhält dabei eine bestimmte CSS-Regel Vorzug vor einer anderen. Existieren viele Regeln mit hoher Priorität kann dabei eine hohe Komplexität entstehen.
Es gibt drei Stufen von Spezifität – nach Typ, nach Klasse und nach ID. Der Typ-Selektor hat dabei die geringste Spezifität und der ID-Selektor die höchste.
Frage 12: Erkläre “web-safe” und “fallback” Schriftarten.
Beim Auswählen einer Schriftart für deine Webseite solltest du beachten, dass nicht jeder Browser jede Schriftart darstellen kann. Daher gibt es eine Reihe von speziell für das Internet etablierten Schriftarten, die sogenannten „web-safe fonts“. Dazu gehören Times New Roman, Arial und Calibri. Falls aus irgendeinem Grund ein Browser diese Schriftarten nicht erkennt, gibt es die „fallback fonts“. Diese Schriftarten werden vom Browser automatisch ausgesucht und verwendet, wenn eine bestimmte Schriftart nicht zur Verfügung steht.
Frage 13: Was ist ‘file splitting’?
Diese Frage ist mehr oder weniger selbsterklärend. Zur besseren Übersicht, Performance und Organisation von CSS Regeln kann es vorteilhaft sein, diese auf mehrere Dateien aufzuteilen. Um dies durchführen zu können, wird ein CSS Präprozessor benötigt.
Die Dateien können beliebig aufgeteilt werden, aber es ist zu empfehlen, sinnvolle logische Einheiten zu bilden. Dies verbessert das Management der Webseite und sorgt für schnellere Ladegeschwindigkeiten.
Frage 14: Was ist Deckkraft (engl. ‘opacity’) ?
Von allen CSS-Fragen im Jobinterview könnte dies die einfachste sein. Deckkraft ist der Grad von Transparenz, die einem Bild zugeordnet ist. Du wirst dich vielleicht wundern, warum diese Frage bei den Fortgeschrittenenfragen zu finden ist. Dies liegt daran, dass gern gefragt wird, wie du dies umsetzen kannst. Du findest unten ein Beispiel dafür.
div {
background: rgb(136, 66, 213);
padding: 10px;
}
Frage 15: Definiere, was ein ‘rule set’ ist.
Im Kontext von CSS ist ein rule set eine Deklaration von Blocks, die nach spezifischen Selektoren kommen. Diese Regeln erklären dem Server wie ein bestimmtes Dokument darzustellen ist.
Frage 16: Definiere, was ein universeller Selektor ist und gib ein Beispiel dafür an.
Universelle Selektoren ermöglichen es, allen Elementen gleichzeitig bestimmte Attribute zuzuordnen.
Ein Beispiel für einen universellen Selektor:
* {
color: red; /* changes the color of all elements to red */
background: blue; /* changes the background of all elements to blue */
}
Frage 17: Worauf wirken ‘class’ und ‘id’-Slektoren?
Ein Klassenselektor wirkt auf alle Elemente, denen diese Klasse zugeordnet ist. Der ID selector ermöglicht es, ein spezifisches Element auszuwählen.
Dies ist eine der wichtigsten Fragen zu CSS in jedem Jobinterview.
Frage 18: Was bedeutet ‘float’ bei CSS?
Das float-Attribut ermöglicht es, Bilder durch Textblöcke zu bewegen, ohne den Textverlauf zu unterbrechen. Genau wie bei Google Docs kann der Text um das Bild herumplatziert werden.
Frage 19: Was ist ein ‘Z-Index’?
Ein Z-Index bei CSS bezeichnet die Ebene, in der ein Element angezeigt wird. Da es bei CSS zu überlappenden Elementen kommen kann, ist es nützlich, den Z-Index manuell angeben zu können. Dadurch lässt sich bestimmen, welches Element im Vordergrund angezeigt wird.
Frage 20: Warum sollte import ganz oben in der Datei angeben werden?
Der Grund warum import als erstes angegeben werden sollte ist, dass dann keine bereits existierenden CSS-Regeln überschrieben werden. Wird import als erstes angegeben, lässt sich dieses Problem meistens umgehen.
Tipps für das Bewerbungsgespräch
Wir haben einige der häufigeren CSS Fragen im Jobinterview besprochen. Dennoch konnten wir nur einen kleinen Ausschnitt aus dem Fragenkatalog besprechen. Jetzt wo du diese Informationen bekommen hast, fragst du dich vielleicht wie es jetzt weitergehen soll.
Während du dich auf das Jobinterview vorbereitest solltest du alle CSS Interviewfragen und ihre Antworten aufschrieben und dir Notizen machen. Durch das Schreiben setzen sich die Fragen im Gedächtnis fest.
Du solltest nicht zu viel Zeit damit verbringen, an deinem CSS-Wissen zu arbeiten. Es hört sich vielleicht kontraproduktiv an, aber das wichtigste im Interview ist es meist, nicht aufgeregt sein und auch mal Mut zur Lücke zu zeigen. Kaum ein Interviewer erwartet, dass du alle Fragen perfekt beantworten kannst. Stattdessen ist es oft wichtiger, sich als Person zu präsentieren, und deine Gedankengänge zu Fragen klar darzulegen.
Nach dem Interview solltest du Geduld beweisen. Oft dauert es relativ lang bis du eine Rückmeldung erhältst. Trotzdem solltest du es unterlassen, jeden Tag telefonisch nachzufragen, denn das hinterlässt meist einen schlechten Eindruck.
Jetzt kostenlosen Crashkurs sichern (Online Programmieren, keine Installation nötig)
Fazit zu CSS im Interview
Zusammen mit HTML ist CSS eins der wichtigsten Werkzeuge für die Webentwicklung. Es werden immer mehr Experten für CSS benötigt. Daher kann es sich durchaus lohnen, sich auf CSS zu spezialisieren.
Bei einer derart steigenden Popularität ist es kein Wunder, dass es immer mehr CSS-bezogene Fragen gibt – und eine davon ist die Frage wie man einen Job in diesem Bereich bekommt. Diese Frage haben wir in diesem Text versucht zu beantworten.
Da CSS so wichtig für die Erstellung von Webseiten ist, suchen Arbeitgeber oft nach Leuten, die bereits Erfahrung in diesem Feld haben. Trotzdem bekommen auch immer wieder Anfänger eine Chance, da viele Firmen auch eigene Traineeprogramme haben. Somit ist es oft wichtiger, den Willen zu zeigen, sich neue Kenntnisse anzueignen. Auch die eigene Persönlichkeit und Ausstrahlung kann ein wichtiger Faktor sein, die Traumstelle letztlich zu bekommen.
Wir haben eine der wichtigsten Fragen zu CSS besprochen. Du solltest diese Fragen Revue passieren lassen und dich gut auf dein Jobinterview vorbereiten.
Viel Glück!
- Programmiere echte Apps als Anfänger
- Keine Installation, sofort loslegen
- Komplett praxisbezogen
- Zugriff auf Online-Editor
