Zusammenfassung von 29 CSS-Interviewfragen (Analyse der Wissenspunkte)

In diesem Artikel werden 29 CSS-Interview-Wissenspunkte mit Ihnen geteilt. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

CSS ist die Abkürzung für Cascading Style Sheets, eine Stylesheet-Sprache, die zur Beschreibung des Layouts von Dokumenten verwendet wird, die in Auszeichnungssprachen wie HTML geschrieben sind. Es ist einer der drei Musketiere, die zum Entwerfen von Webseiten verwendet werden, die anderen beiden sind HTML und Javascript. HTML和Javascript。

CSS 的设计目的是使样式和内容分离，包括布局、颜色和字体。这种分离可以提高内容的可访问性，在样式特征的规范中提供更多的灵活性和控制，通过在一个单独的. .css 文件中指定相关的 CSS，使多个 web 页面能够共享格式，并减少结构内容中的复杂性和重复。

它具有简单的语法，并使用大量的英文关键字来指定各种样式属性的名称。

既然我们已经讨论了CSS的基础知识，让我们来观察一下基于CSS的重要面试问题。

问题1：什么是 CSS？

CSS（层叠样式表）是一种样式语言，对于 HTML 元素来说足够简单。 它在网页设计中非常流行，其应用在XHTML中也很常见。

问题2：为什么要开发CSS？

CSS是在1997年开发的，作为一种web开发人员设计他们正在创建的web页面布局的方法。它的目的是让开发者将网站代码的内容和结构从视觉设计中分离出来。

这种结构和设计的分离允许HTML执行比原来更多的功能。

【推荐教程：CSS视频教程】

问题3：CSS的主要版本有哪些？

CSS的不同版本：

• CSS1

• CSS2

• CSS2.1

• CSS3

问题4：CSS样式的组成部分是什么？

一个样式规则由三部分组成：

• 选择器–选择器是 HTML 标记，用于选择要设置样式的内容。 它根据其ID，类和名称选择 HTML元素。

• 属性–属性是 HTML 标签的一种属性。 简而言之，所有 HTML 属性都转换为 CSS 属性。

• 值– CSS中的值定义CSS属性的一组有效值。

问题 5：有多少种方法可以将 CSS 集成为 web 页面

CSS 可以集成为三种方式

1、内联：直接在HTML元素上使用

<p>hello world</p>

2、外部:在工作空间中创建单独的CSS文件，然后在创建的每个web页面中链接它们

<link>

3、内部: web 页面的 head 元素在其中实现了内部 CSS。

     <style> 
             P{
                   color : lime;
               background-color:black;
                }
     </style>

问题 6：谁在维护 CSS 规范？

万维网协会维护 CSS规范。

问题 7：伪元素是什么意思？

伪元素是添加到选择器的关键字，它允许一种样式，即所选元素的特定部分。CSS用于在HTML标记中应用样式，它允许在不影响实际文档的情况下对文档进行额外标记。它可以用来：

• 为第一个字母、行或元素设置样式。

• 插入内容

语法：

Selector: :pseudo-element
{Property1 :value;
Property2 :value;}

问题 8：CSS有什么优势？

CSS的优点是:

• 一致性 – CSS有助于构建一致的框架，设计人员可以使用该框架来构建其他站点。 因此，网页设计师的效率也提高了。

• 易于使用 – CSS 是非常容易学习和简化网站开发。所有代码都放在一个页面上，这意味着对代码行进行改进或编辑不需要重复修改多个页面.

• *网站速度 *– 通常，一个网站使用的代码最多可以达到 2 页或更多。但是对于CSS，这不是问题。它只需要2-3

  CSS ist so konzipiert, dass Stil und Inhalt getrennt bleiben, einschließlich Layout, Farben und Schriftarten. Diese Trennung kann die Zugänglichkeit von Inhalten verbessern, mehr Flexibilität und Kontrolle bei der Spezifikation von Stilmerkmalen bieten und es mehreren Webseiten ermöglichen, Formate gemeinsam zu nutzen und die Komplexität und Duplizierung strukturierter Inhalte zu reduzieren.
• Es hat eine einfache Syntax und verwendet eine große Anzahl englischer Schlüsselwörter, um die Namen verschiedener Stilattribute anzugeben.

  Nachdem wir nun die Grundlagen von CSS besprochen haben, werfen wir einen Blick auf wichtige CSS-basierte Interviewfragen.

  
• Frage 1: Was ist CSS?

  CSS (Cascading Style Sheets)

  ist eine Stilsprache, die für HTML-Elemente einfach genug ist. Es ist im Webdesign sehr beliebt und wird auch häufig in XHTML eingesetzt. 🎜

  🎜Frage 2: Warum CSS entwickeln? 🎜

  🎜🎜CSS🎜 wurde 1997 als Möglichkeit für Webentwickler entwickelt, das Layout der von ihnen erstellten Webseiten zu gestalten. Sein Zweck besteht darin, Entwicklern die Trennung von Inhalt und Struktur des Website-Codes vom visuellen Design zu ermöglichen. 🎜🎜Diese Trennung von Struktur und Design ermöglicht es HTML, mehr Funktionen auszuführen, als es ursprünglich könnte. 🎜🎜【Empfohlenes Tutorial: CSS-Video-Tutorial]🎜

  🎜Frage 3: Was sind die Hauptversionen von CSS? 🎜

  🎜 Verschiedene Versionen von CSS: 🎜
  🎜🎜CSS1🎜🎜🎜🎜CSS2🎜🎜🎜🎜CSS2.1🎜🎜🎜🎜CSS3🎜🎜

  🎜Frage 4: Was sind die Komponenten von CSS-Stilen? 🎜

  🎜Eine Stilregel besteht aus drei Teilen: 🎜
  🎜🎜🎜Selektor🎜 – Der Selektor ist ein HTML-Tag, mit dem der festzulegende Stil ausgewählt wird . Inhalt. Es wählt HTML-Elemente basierend auf ihrer ID, Klasse und ihrem Namen aus. 🎜🎜🎜🎜🎜Attribute🎜 – Ein Attribut ist ein Attribut eines HTML-Tags. Kurz gesagt, alle HTML-Eigenschaften werden in CSS-Eigenschaften umgewandelt. 🎜🎜🎜🎜🎜Werte🎜 – Werte in CSS definieren einen Satz gültiger Werte für eine CSS-Eigenschaft. 🎜🎜

  🎜Frage 5: Wie viele Möglichkeiten gibt es, CSS in eine Webseite zu integrieren? 🎜

  🎜CSS kann auf drei Arten integriert werden🎜🎜1, 🎜inline🎜: direkt in HTML-Element Wird verwendet bei 🎜

  //物理元素
  <b>我想用b标签加粗</b>
   
  //逻辑元素
  <strong>我想用strong标签加粗</strong>
   
  //两段文字都加粗了，而且视觉效果完全一样

  🎜2, 🎜External🎜: Erstellen Sie separate CSS-Dateien im Arbeitsbereich und verknüpfen Sie sie dann in jeder erstellten Webseite. 🎜

  selector:pseudo-class{property:value;}

  🎜3, 🎜Internal🎜: Das Head-Element der Webseite wird darin implementiert Internes CSS. 🎜rrreee

  🎜Frage 6: Wer pflegt die CSS-Spezifikation? 🎜

  🎜Das World Wide Web Consortium pflegt CSS-Spezifikationen. 🎜

  🎜Frage 7: Was bedeutet Pseudoelement? 🎜

  🎜Pseudoelemente sind einem Selektor hinzugefügte Schlüsselwörter, die eine Gestaltung eines bestimmten Teils des ausgewählten Elements ermöglichen. CSS wird zum Anwenden von Stilen innerhalb des HTML-Markups verwendet, wodurch zusätzliches Markup für das Dokument ermöglicht wird, ohne dass sich dies auf das eigentliche Dokument auswirkt. Es kann verwendet werden, um: 🎜
  🎜🎜Stile für den ersten Buchstaben, die erste Zeile oder das erste Element festzulegen. 🎜🎜🎜🎜Inhalt einfügen🎜🎜
  🎜Syntax: 🎜rrreee

  🎜Frage 8: Was sind die Vorteile von CSS? 🎜

  🎜 Vorteile von CSS sind: 🎜
  🎜🎜🎜Konsistenz🎜 – CSS hilft beim Aufbau eines konsistenten Frameworks, das Designer zum Erstellen anderer Websites verwenden können. Dadurch steigt auch die Effizienz von Webdesignern. 🎜🎜🎜🎜🎜Einfach zu verwenden🎜 – CSS ist sehr einfach zu erlernen und vereinfacht die Website-Entwicklung. Der gesamte Code wird auf einer Seite platziert, was bedeutet, dass Verbesserungen oder Änderungen an Codezeilen nicht auf mehreren Seiten wiederholt werden müssen. 🎜🎜🎜🎜*Site Speed* – Typischerweise der von Eine Website kann bis zu 2 Seiten oder mehr umfassen. Aber mit CSS ist das kein Problem. Es sind nur 2-3 Codezeilen erforderlich, sodass die Website-Datenbank sauber bleibt und Probleme beim Laden der Website vermieden werden. 🎜🎜🎜🎜🎜Gerätekompatibilität🎜 – Da Menschen unterschiedliche Arten von Smart-Geräten verwenden, um auf das Internet zuzugreifen, besteht Bedarf an responsivem Webdesign. Die Rolle von CSS besteht hier darin, Webseiten reaktionsfähiger zu machen, sodass sie auf allen Geräten gleich angezeigt werden. 🎜🎜🎜🎜🎜Multi-Browser-Unterstützung🎜 – CSS bietet Multi-Browser-Unterstützung und ist mit allen gängigen Internetbrowsern kompatibel. 🎜

• Neupositionierung – Mit CSS können Sie Änderungen in der Position von Webelementen auf der Seite definieren. Seine Implementierung ermöglicht es Entwicklern, HTML-Elemente an beliebiger Stelle zu platzieren, je nach ästhetischem Reiz der Seite oder anderen Gesichtspunkten.

Frage 9: Was ist ein CSS-Gradient?

Verlauf ist der Prozess, bei dem wir einen Zwischenrahmen zwischen zwei Bildern erstellen, um das Aussehen des ersten Bildes zu erhalten und ihn dann zum zweiten Bild weiterzuentwickeln. Er wird hauptsächlich zum Erstellen von Animationen verwendet.

Frage 10: Was ist CSS-Spezifität?

CSS-Spezifität ist eine Bewertung oder Stufe, die bestimmt, welche Stildeklaration ein Element verwenden muss. Es gibt vier Kategorien in CSS, die bestimmte Ebenen von Selektoren gewähren können:

• Inline-Stile

• ID

• Klassen, Attribute und Pseudoklassen

• Elemente und Pseudoelemente

Fragen 11: Was sind die Nachteile von CSS? CSS3. Dadurch wird CSS besonders für Anfänger sehr verwirrend.

Mangelnde Sicherheit
• – Da CSS ein auf offenem Text basierendes System ist, verfügt es nicht über ein integriertes Sicherheitssystem, das ein Überschreiben verhindert. Mit Lese-/Schreibzugriff darauf kann jeder die CSS-Datei und die Links ändern.

Fragmentierung
• – Bei Verwendung von CSS funktioniert es möglicherweise nicht in einem Browser in einem anderen. Bevor eine Website online geht, müssen Webentwickler daher die Kompatibilität testen, indem sie das Programm auf mehreren Browsern ausführen.

Komplexität
• – Die Verwendung von Drittanbietersoftware wie Microsoft FrontPage kann CSS komplex machen.

Frage 13: Was ist RWD (Responsive Web Design)?

• Die RWD-Technologie (Responsive Web Design) funktioniert perfekt auf jeder Bildschirmgröße und auf Geräten wie Mobilgeräten, Tablets, Desktops und Laptops. Zeigen Sie Designseiten also an Wir müssen nicht für jedes Gerät unterschiedliche Seiten erstellen.

Frage 14: Was sind die Vorteile von CSS-Sprites?

Die Vorteile von CSS-Sprites sind:

Reduziert die Ladezeit von Webseiten durch die Kombination verschiedener kleiner Bilder in einem Bild.

Reduzieren Sie HTTP-Anfragen und verkürzen Sie so die Ladezeiten.

• Frage 14: Was ist ein CSS-Kontextselektor?

• Kontextselektor wird streng genommen

  kombinierter Nachkommenselektor

  genannt, bei dem es sich um eine Reihe von durch Leerzeichen getrennten Tag-Namen handelt. Wird verwendet, um Tags auszuwählen, die Nachkommen des angegebenen Vorgängerelements sind. Solange ein Tag in seiner Hierarchie einen solchen Vorfahren „upstream“ hat, wird das Tag ausgewählt. Es spielt keine Rolle, wie viele Ebenen zwischen dem Tag und dem Kontext, der den Vorfahren darstellt, liegen.

Frage 15: Was ist progressive Verbesserung und sanfte Verschlechterung?

Das Konzept der progressiven Verbesserung bezieht sich darauf, von der grundlegendsten Benutzerfreundlichkeit auszugehen und die Benutzerfreundlichkeit und Zugänglichkeit von Website-Seiten in Low-Level-Browsern sicherzustellen , schrittweises Hinzufügen von Funktionen und Verbesserung der Benutzererfahrung. Im Wesentlichen gehören einige unserer täglichen Entwicklungsgewohnheiten, wie z. B. die Verwendung von Markup-Sprache zum Schreiben von Seiten und die anschließende Steuerung des Seitenstils über Stylesheets, zum Konzept der progressiven Verbesserung. Andere offensichtlichere Verhaltensweisen umfassen die Verwendung neuer Technologien wie z HTML5 und CSS3 für erweiterte Browser zur Verbesserung der Benutzererfahrung für Seiten.

Das Konzept der reibungslosen Verschlechterung bezieht sich darauf, zunächst die neueste Technologie zu verwenden, um die stärksten Funktionen und Benutzererlebnisse für fortgeschrittene Browser zu schaffen, und dann diese nicht unterstützten Funktionen und Erlebnisse basierend auf den Einschränkungen von Low-Level-Browsern in unserem täglichen Leben schrittweise abzuschwächen Leben Bei der Entwicklung des IE besteht ein typisches Beispiel für eine reibungslose Verschlechterung darin, zuerst den Seitencode für Chrome zu schreiben und dann die Ausnahmen im IE zu beheben oder die Funktionen zu entfernen, die für den IE nicht implementiert werden können

Diese beiden konzeptionellen Methoden haben also Tatsächlich existierten die Begriffe „progressive Enhancement“ und „sanfter Abbau“ in unserer täglichen Entwicklungsarbeit erst in den letzten Jahren. In unserer aktuellen praktischen Anwendung von HTML5 und CSS3 sind diese beiden Konzepte besonders wichtig. Wie kann sichergestellt werden, dass die sich ständig ändernden neuen Technologien verwendet werden, um eine Website zu erstellen, die eine grundlegende Benutzerfreundlichkeit unter Mainstream-Browsern bietet, und um das Erlebnis für fortgeschrittene Browser zu verbessern? Dies sind die Ideen, über die wir uns während des Entwicklungsprozesses im Klaren sein müssen.

Frage 16: Wie fügen wir Webseiten Symbole hinzu?

Wir können Symbolbibliotheken wie font-awesome oder Alibabas iconfont verwenden, um Symbole zu HTML-Webseiten hinzuzufügen. Wir müssen den Namen der angegebenen Symbolklasse zu jedem Inline-HTML-Element hinzufügen. (<i></i> oder <span></span>). Die Icons in der Icon-Bibliothek sind skalierbare Vektoren und können per CSS angepasst werden.

Frage 17: Welches Attribut gibt die Breite des Rahmens an?

border-width gibt die Breite des Rahmens an.

问题 18：如何区分物理标签和逻辑标签?

物理标签被称为表示标记，而逻辑标签对于外观是无用的。物理标签是较新的版本，而逻辑标签是旧的并且专注于内容。

如题，我们的标签元素写上后，浏览器就会渲染出结果，但不仅仅是这么简单

//物理元素
<b>我想用b标签加粗</b>
 
//逻辑元素
<strong>我想用strong标签加粗</strong>
 
//两段文字都加粗了，而且视觉效果完全一样

确实，文字加粗了，两者都达到了我们想要的目的，但是我们忽略了一个问题，既然b标签可以加粗，那么strong这个标签同样是加粗，存在的 意义又是什么呢？既然W3C定义了两个，它们之间的不同点是什么呢？它们之间的相同点又是什么呢？

物理元素

物理元素，又叫实体标签，它所做的是一种物理行为，比如上面我把一段文字用b标签加粗了，它所传达的给浏览器，告诉浏览器 我要加粗这段文字，从单词Bold中也可以看出来，英文中仅仅是加粗的意思，并没有其他作用。总结来说就是一句话： 物理元素就是告诉浏览器该怎么显示出来。

逻辑元素

逻辑元素，从英文字面上Strong就可以看出它是强调的意思，所以我们用这个逻辑元素(如上strong)来向浏览器传达 一个强调某段文字重要性的消息，说明此文字较为重要，也有利于搜索引擎收录。

Web标准主张XHTML不涉及具体的表现形式，“强调”可以用加粗来强调，也可以用别的方式强调，也可以通过css来改变strong的具体表现 ，还有就是并不是有了strong逻辑标签，就不用b标签来表示字体加粗了，b标签和strong标签默认情况下强调的效果一致，strong完全可以定义成别的样式，用来强调 效果，但是最好符合W3C标准，它更提倡内容与样式分离，所以单纯为了达到加粗而使用b标签不建议这样做， 从XHTML文档有意义性及用户体验角度来说，strong逻辑标签更加合适，而SEO方面，则针对优化情况而定。

问题19：如何在CSS中定义一个伪类?它们是用来干什么的

CSS伪类是用来添加一些选择器的特殊效果。伪类的语法

selector:pseudo-class{property:value;}

问题 20：CSS和SCSS有什么区别？

CSS 和 SCSS 之间的区别如下：

• CSS是一种用于设计web页面的样式语言，而SCSS用于为浏览器组合CSS样式表。

• SCSS 提供了一些变量，可以使用这些变量来缩短代码，这是与 CSS 相比的一大优势。

问题 21：嵌入式样式表的优缺点是什么？

嵌入式样式表的优点:

• 可以在一个文档中创建多种标签类型。

• 在复杂情况下，可以使用选择器和分组方法来应用样式。

• 无需额外下载。

嵌入式样式表的缺点：

无法控制多个文档。

问题 22：列出使用的各种媒体类型。

不同的介质不区分大小写，因此它们具有不同的属性。 他们是：

• aural - 用于语音和音频合成器

• print - 用于打印机

• projection - 用于方案展示，比如幻灯片

• handheld -     用于小的手持的设备

• screen -  用于电脑显示器

问题 23：font 的属性有哪些？

• Font-style

• Font-variant

• Font-weight

• Font-size/line-weight

• Font-family

问题 24：“规则集”是什么意思？

该指令告诉浏览器如何在HTML页面上渲染特定元素。 它由一个选择器和一个遵循规则集的声明块组成。 选择器可以附加到其他选择器，以通过规则集进行标识。

问题 25：什么是 CSS 框架？

CSS 框架是一个库，它允许使用CSS语言进行更轻松，更符合标准的Web设计。 这些框架中的大多数至少包含一个网格以及更多功能和其他基于Javascript的功能。 一些著名的CSS框架有：ACSS，Bulma，YAML，Foundation等。

Frage 26: Stellen Sie kurz die Vor- und Nachteile der Verwendung der Bild-Base64-Kodierung vor. Die

Base64-Kodierung ist ein Bildverarbeitungsformat, das einen bestimmten Algorithmus verwendet, um das Bild in eine lange Zeichenfolge zu kodieren. Bei der Anzeige auf der Seite kann die Zeichenfolge verwendet werden, um das
url-Attribut des Bildes zu ersetzen.
Die Vorteile der Verwendung von Base64 sind:
(1) Reduzieren Sie die HTTP-Anfrage für ein Bild.
Die Nachteile der Verwendung von Base64 sind:
(1) Gemäß dem Codierungsprinzip von Base64 ist die codierte Größe 1/3 größer als die Originaldateigröße. Wenn große Bilder in HTML/CSS kodiert werden, erhöht sich nicht nur die Dateigröße und die Ladegeschwindigkeit der Datei, sondern auch die Zeit, die der Browser zum Parsen und Rendern der HTML- oder CSS-Datei benötigt .
(2) Base64 kann nicht direkt zwischengespeichert werden, Sie können nur Dateien zwischenspeichern, die Base64 enthalten, z. B. HTML oder CSS. Dies ist viel schlimmer als das direkte Zwischenspeichern von Bildern durch die Domäne.
(3) Kompatibilitätsprobleme, Browser vor ie8 werden nicht unterstützt.
Im Allgemeinen können kleine Symbole einiger Websites mithilfe von Base64-Bildern eingeführt werden.

Frage 27: Verstehen Sie die BFC-Spezifikation (Blockformatierungskontext)?

BFC bezieht sich auf den Formatierungskontext auf Blockebene. Nachdem ein Element einen BFC gebildet hat, wirkt sich das von seinen internen Elementen generierte Layout nicht auf externe Elemente aus, und das Layout externer Elemente wirkt sich nicht auf die internen Elemente im BFC aus. Ein BFC ist wie ein isolierter Bereich und hat keinen Einfluss auf andere Bereiche.

Im Allgemeinen ist das Stammelement ein BFC-Bereich und absolut positionierte Elemente werden auch dann erstellt, wenn der Wert des Anzeigeattributs Inline-Block oder Flex ist. Außerdem wird BFC erstellt, wenn der Überlaufwert des Elements nicht sichtbar ist.

Frage 28: Was ist IFC?

IFC bezieht sich auf den Formatierungskontext auf Zeilenebene, der einige Layoutregeln wie diese hat: (1) Die Felder im Kontext auf Zeilenebene werden nacheinander in horizontaler Richtung platziert. (2) Wenn eine Zeile nicht ausreicht, wird automatisch zur nächsten Zeile gewechselt.

(3) Die Höhe des Kontexts auf Zeilenebene wird durch die Höhe des höchsten Inline-Felds darin bestimmt.

Frage 29: Welche Möglichkeiten gibt es, CSS zu optimieren und die Leistung zu verbessern?

Ladeleistung:
(1) CSS-Komprimierung: Durch das Packen und Komprimieren des geschriebenen CSS kann das Volumen erheblich reduziert werden.
(2) CSS-Einzelstil: Wenn untere und linke Ränder erforderlich sind, wird oft margin:top 0 bottom 0; gewählt, aber margin-bottom:bot
tom;margin-left:left;
(3) Reduzieren Sie die Verwendung von @import. Es wird empfohlen, einen Link zu verwenden, da letzterer beim Laden der Seite zusammen geladen wird und ersterer vor dem Laden auf das Laden der Seite wartet.
Wählerleistung:
(1) Schlüsselwähler. Der letzte Teil des Selektors ist der Schlüsselselektor (d. h. der Teil, der zum Abgleichen des Zielelements verwendet wird). CSS-Selektoren werden von rechts nach
links abgeglichen. Bei Verwendung von Nachkommenselektoren durchläuft der Browser alle untergeordneten Elemente, um festzustellen, ob es sich um das angegebene Element usw. handelt.
(2) Wenn die Regel einen ID-Selektor als Schlüsselselektor hat, fügen Sie der Regel keine Tags hinzu. Filtern Sie irrelevante Regeln heraus (damit das Stilsystem keine Zeit damit verschwendet, sie abzugleichen).
(3) Vermeiden Sie die Verwendung von Platzhalterregeln wie *{}, die Anzahl der Berechnungen ist atemberaubend! Wählen Sie nur die Elemente aus, die Sie benötigen.
(4) Versuchen Sie, so wenig Labels wie möglich auszuwählen, und verwenden Sie stattdessen Klassen.
(5) Verwenden Sie Nachkommen-Selektoren so wenig wie möglich und reduzieren Sie das Gewicht des Selektors. Die Kosten für Nachkommen-Selektoren sind am höchsten. Versuchen Sie, die Tiefe des Selektors auf ein Minimum zu reduzieren. Verwenden Sie mehr Klassen, um jedes Beschriftungselement zuzuordnen.
(6) Verstehen Sie, welche Attribute vererbt werden können, und vermeiden Sie dann die wiederholte Angabe von Regeln für diese Attribute.
Rendering-Leistung:
(1) Verwenden Sie Hochleistungsattribute sorgfältig: Floating und Positionierung.
(2) Minimieren Sie das Neuanordnen und Neuzeichnen von Seiten.
(3) Leere Regeln entfernen: {}. Der Grund für leere Regeln liegt im Allgemeinen darin, Stile zu reservieren. Das Entfernen dieser leeren Regeln wird zweifellos die Größe des CSS-Dokuments verringern.
(4) Wenn der Attributwert 0 ist, wird keine Einheit hinzugefügt.
(5) Der Attributwert ist eine gleitende Dezimalzahl 0.** und die 0 vor dem Dezimalpunkt kann weggelassen werden.
(6) Standardisieren Sie verschiedene Browser-Präfixe: diejenigen mit Browser-Präfixen stehen an erster Stelle. Es folgen Standardeigenschaften.
(7) Verwenden Sie nicht das Präfix @import, da dies die Ladegeschwindigkeit von CSS beeinträchtigt.
(8) Optimieren Sie die Verschachtelung von Selektoren und versuchen Sie, zu tiefe Ebenen zu vermeiden.
(9) CSS-Sprite-Bild, ein kleines Symbol in einem ähnlichen Teil derselben Seite, ist bequem zu verwenden und reduziert die Anzahl der Seitenanfragen, aber gleichzeitig wird das Bild selbst größer. Überlegen Sie bei der Verwendung sorgfältig Informieren Sie sich über die Vor- und Nachteile, bevor Sie es verwenden.
(10) Aufgrund der Rolle der Anzeige sind einige Stilkombinationen ungültig, was nur die Größe des Stils erhöht und sich auch auf die Analyseleistung auswirkt.
(11) Missbrauchen Sie Webfonts nicht. WebFonts mögen auf chinesischen Websites unbekannt sein, erfreuen sich jedoch im Ausland großer Beliebtheit. Web-Schriftarten sind oft groß und einige Browser blockieren die Seitendarstellung und beeinträchtigen die Leistung beim Herunterladen von Web-Schriftarten.
Wartbarkeit und Robustheit:
(1) Extrahieren Sie Stile mit denselben Attributen, integrieren Sie sie und verwenden Sie sie über Klassen auf der Seite, um die Wartbarkeit von CSS zu verbessern.
(2) Trennung von Stil und Inhalt: CSS-Code in externes CSS definieren.


Ursprüngliche Adresse: https://codersera.com/blog/top-css-interview-questions-and-answers/

Weitere Kenntnisse zum Thema Programmierung finden Sie unter:

Programmiervideo

! !

Das obige ist der detaillierte Inhalt vonZusammenfassung von 29 CSS-Interviewfragen (Analyse der Wissenspunkte). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!