Heim Web-Frontend CSS-Tutorial Studienführer zu CSS-Code-Schreibstandards

Studienführer zu CSS-Code-Schreibstandards

Mar 09, 2017 pm 06:06 PM
css 规范

Hier ist ein Studienleitfaden für CSS-Code-Schreibstandards, einschließlich Codekommentare, Benennungsstandards, Leerzeicheneinrückungen usw., die alle auf den üblichen Konventionen aller basieren. Es lohnt sich auf jeden Fall, sie zu lernen und darauf zu verweisen Weiter

1. Formatierungscode

[Empfehlung]: CSS-Dateien verwenden UTF-8-Kodierung ohne BOM

1.2 Einrückung
[Pflichtfeld]: Verwenden Sie 4 Leerzeichen als Einrückungsebene, 2 Leerzeichen oder Tabulatorzeichen sind nicht zulässig.

.selector {   
    margin: 0;   
    padding: 0;   
}
Nach dem Login kopieren


1.3 Leerzeichen
[Obligatorisch]: Zwischen dem Selektor und { muss ein Leerzeichen stehen.

.selector {   
}
Nach dem Login kopieren


[Obligatorisch]: Zwischen dem Selektor und { muss ein Leerzeichen stehen.


margin: 0;
Nach dem Login kopieren


[Obligatorisch]: Wenn sich das Listenattributbuch in einer einzelnen Zeile befindet, muss ihm ein Leerzeichen


< folgen 🎜>

font-family: Aria, sans-serif;
Nach dem Login kopieren


1,4 Zeilenlänge

[Pflichtfeld]: Jede Zeile darf 120 Zeichen nicht überschreiten, es sei denn, eine einzelne Zeile ist unteilbar.
[Empfehlung]: Bei sehr langen Stilen schließen Sie den Stilwert in ein Leerzeichen oder danach ein. Es wird empfohlen, ihn logisch zu gruppieren.


/* 不同属性值按逻辑分组 */  
background:   
    transparent url(aVeryVeryVeryLongUrlIsPlacedHere)   
    no-repeat 0 0;   
/* 可重复多次的属性,每次重复一行 */  
background-image:   
    url(aVeryVeryVeryLongUrlIsPlacedHere)   
    url(anotherVeryVeryVeryLongUrlIsPlacedHere);   
/* 类似函数的属性值可以根据函数调用的缩进进行 */  
background-image: -webkit-gradient(   
    linear,   
    left bottombottom,   
    left top,   
    color-stop(0.04, rgb(88,94,124)),   
    color-stop(0.52, rgb(115,123,162))   
);
Nach dem Login kopieren


1.5 Selektor

[Obligatorisch]: Wenn eine Regel mehrere Selektoren enthält, muss jeder Selektor aktiviert sein eine eigene Linie.

/* good */  
.post,   
.page,   
.comment {   
    line-height: 1.5;   
}   
/* bad */  
.post, .page, .comment {   
    line-height: 1.5;   
}
Nach dem Login kopieren


[Pflichtfeld]: >, +, ~ Lassen Sie auf jeder Seite des Selektors ein Leerzeichen.

Beispiel:



/* good */  
main > nav {   
    padding: 10px;   
}   
label + input {   
    margin-left: 5px;   
}   
input:checked ~ button {   
    background-color: #69C;   
}   
/* bad */  
main>nav {   
    padding: 10px;   
}   
label+input {   
    margin-left: 5px;   
}   
input:checked~button {   
    background-color: #69C;   
}
Nach dem Login kopieren


[Obligatorisch] Werte in Attributselektoren müssen in doppelte Anführungszeichen gesetzt werden.


css   
/* good */  
article[character="juliet"] {   
    voice-family: "Vivien Leigh", victoria, female   
}   
/* bad */  
article[character=&#39;juliet&#39;] {   
    voice-family: "Vivien Leigh", victoria, female   
}
Nach dem Login kopieren


2. Selektoren und Attributabkürzungen

2.1 Selektoren
[Obligatorisch] Wenn nicht erforderlich, ist dies der Fall Es ist nicht gestattet, Typselektoren hinzuzufügen, um die ID- und Klassenselektoren einzuschränken.
Erklärung: Es hat einen gewissen Einfluss auf Leistung und Wartbarkeit.
Beispiel:
css


[Empfehlung] Die Verschachtelungsebene des Selektors sollte nicht größer als 3 Ebenen sein und die später aufgeführten Qualifikationsbedingungen sollten so präzise wie möglich sein .
/* good */  
#error,   
.danger-message {   
    font-color: #c00;   
}   
/* bad */  
dialog#error,   
p.danger-message {   
    font-color: #c00;   
}
Nach dem Login kopieren


Beispiel:


/* good */  
#username input {}   
.comment .avatar {}   
/* bad */  
.page .header .login #username input {}   
.comment p * {}
Nach dem Login kopieren


2.2 Attributabkürzung

[Vorschlag] kann verwendet werden Wenn es sich um Abkürzungen handelt, versuchen Sie, Attributabkürzungen zu verwenden.
Beispiel:


/* good */  
.post {   
    font: 12px/1.5 arial, sans-serif;   
}   
/* bad */  
.post {   
    font-family: arial, sans-serif;   
    font-size: 12px;   
    line-height: 1.5;   
}
Nach dem Login kopieren


[Empfehlung] Bei der Verwendung von Abkürzungen wie border / margin / padding sollten Sie auf die Auswirkung impliziter Werte achten ​​für tatsächliche Werte Verwenden Sie Abkürzungen nur, wenn Sie Werte wirklich in mehrere Richtungen festlegen müssen.

Erklärung: Abkürzungen wie „Rahmen“ / „Rand“ / „Padding“ legen die Werte mehrerer Eigenschaften gleichzeitig fest, und es ist einfach, Einstellungen zu überschreiben, die nicht überschrieben werden müssen. Wenn einige Richtungen Werte von anderen Deklarationen erben müssen, sollten diese separat festgelegt werden.

Beispiel:

/* centering <article class="page"> horizontally and highlight featured ones */  
article {   
    margin: 5px;   
    border: 1px solid #999;   
}   
/* good */  
.page {   
    margin-right: auto;   
    margin-left: auto;   
}   
.featured {   
    border-color: #69c;   
}   
/* bad */  
.page {   
    margin: 5px auto; /* introducing redundancy */  
}   
.featured {   
    border: 1px solid #69c; /* introducing redundancy */  
}
Nach dem Login kopieren


2.3 Lassen Sie zwischen jedem Regelsatz eine Leerzeile


/* good */  
.selector1 {   
  display: block;   
  width: 100px;   
}   
.selector2 {   
  padding: 10px;   
  margin: 10px auto;   
}   
/* bad */  
.selector1 {   
  display: block;   
  width: 100px;   
}   
.selector2 {   
  padding: 10px;   
  margin: 10px auto;   
}
Nach dem Login kopieren
3. Wert und Einheit

3.1 Text
[Pflichtfeld] Der Textinhalt muss in doppelte Anführungszeichen gesetzt werden.
Erklärung: Texttypinhalte können in Selektoren, Attributwerten usw. enthalten sein.
Beispiel:


/* good */  
html[lang|="zh"] q:before {   
    font-family: "Microsoft YaHei", sans-serif;   
    content: "“";   
}   
html[lang|="zh"] q:after {   
    font-family: "Microsoft YaHei", sans-serif;   
    content: "”";   
}   
/* bad */  
html[lang|=zh] q:before {   
    font-family: &#39;Microsoft YaHei&#39;, sans-serif;   
    content: &#39;“&#39;;   
}   
html[lang|=zh] q:after {   
    font-family: "Microsoft YaHei", sans-serif;   
    content: "”";   
}
Nach dem Login kopieren
3.2 Wert


[Obligatorisch] Wenn der Wert eine Dezimalzahl zwischen 0 und 1 ist, lassen Sie 0 weg für den ganzzahligen Teil.

Beispiel:



/* good */  
panel {   
    opacity: .8   
}   
/* bad */  
panel {   
    opacity: 0.8   
}
Nach dem Login kopieren
3.3 url()


[Obligatorisch] Der Pfad in der Funktion url() wird nicht in Anführungszeichen gesetzt .

Beispiel:



body {   
    background: url(bg.png);   
}
Nach dem Login kopieren


3.4 Länge

[Pflichtfeld] Die Einheit muss weggelassen werden, wenn die Länge 0 ist . (Nur die Längeneinheit kann weggelassen werden)
Beispiel:


/* good */  
body {   
    padding: 0 5px;   
}   
/* bad */  
body {   
    padding: 0px 5px;   
}
Nach dem Login kopieren
3.5 Farbe


[Obligatorisch] RGB-Farbwerte ​Es muss die hexadezimale Schreibweise #rrggbb verwendet werden. rgb() ist nicht erlaubt.


[Pflichtfeld] Wenn ein Farbwert abgekürzt werden kann, muss die abgekürzte Form verwendet werden.
/* good */  
.success {   
    box-shadow: 0 0 2px rgba(0, 128, 0, .3);   
    border-color: #008000;   
}   
/* bad */  
.success {   
    box-shadow: 0 0 2px rgba(0,128,0,.3);   
    border-color: rgb(0, 128, 0);   
}
Nach dem Login kopieren
Beispiel:



[Obligatorisch] Benannte Farbwerte sind für Farbwerte nicht zulässig.
/* good */  
.success {   
    background-color: #aca;   
}   
/* bad */  
.success {   
    background-color: #aaccaa;   
}
Nach dem Login kopieren
Beispiel:



[Empfehlung] Verwenden Sie Kleinbuchstaben für englische Zeichen in Farbwerten. Wenn Sie keine Kleinbuchstaben verwenden, müssen Sie sicherstellen, dass diese innerhalb desselben Projekts konsistent bleiben.
/* good */  
.success {   
    color: #90ee90;   
}   
/* bad */  
.success {   
    color: lightgreen;   
}
Nach dem Login kopieren
Beispiel:



/* good */  
.success {   
    background-color: #aca;   
    color: #90ee90;   
}   
/* good */  
.success {   
    background-color: #ACA;   
    color: #90EE90;   
}   
/* bad */  
.success {   
    background-color: #ACA;   
    color: #90ee90;   
}
Nach dem Login kopieren


3.6 2D-Position

[Pflichtfeld] Sowohl die horizontale als auch die vertikale Richtung müssen als Standort angegeben werden .
Erklärung:
Der Anfangswert der 2D-Position beträgt 0 % 0 %, aber wenn nur ein Wert in einer Richtung vorhanden ist, wird der Wert in der anderen Richtung als Mitte geparst. Um Verwirrung beim Verständnis zu vermeiden, sollten Werte in beide Richtungen gleichzeitig angegeben werden. Definition des Attributwerts „Hintergrundposition“
Beispiel:


/* good */  
body {   
    background-position: center top; /* 50% 0% */  
}   
/* bad */  
body {   
    background-position: top; /* 50% 0% */  
}
Nach dem Login kopieren
4. Textlayout

4.1 Schriftfamilie
[Obligatorisch] Attribut „Schriftfamilie“. Der Name der Schriftartfamilie sollte den englischen Familiennamen der Schriftart verwenden. Wenn Leerzeichen vorhanden sind, müssen diese in Anführungszeichen gesetzt werden.
Erklärung:
Der sogenannte englische Familienname ist ein Metadatum der Schriftartendatei. Gebräuchliche Namen lauten wie folgt:



示例:

h1 {   
    font-family: "Microsoft YaHei";   
}
Nach dem Login kopieren

[强制] font-family 按「西文字体在前、中文字体在后」、「效果佳 (质量高/更能满足需求) 的字体在前、效果一般的字体在后」的顺序编写,最后必须指定一个通用字体族( serif / sans-serif )


示例:

/* Display according to platform */  
.article {   
    font-family: Arial, sans-serif;   
}   
/* Specific for most platforms */  
h1 {   
    font-family: "Helvetica Neue", Arial, "Hiragino Sans GB", "WenQuanYi Micro Hei", "Microsoft YaHei", sans-serif;   
}
Nach dem Login kopieren


[强制] font-family 不区分大小写,但在同一个项目中,同样的 Family Name 大小写必须统一。
示例:

/* good */  
body {   
    font-family: Arial, sans-serif;   
}   
h1 {   
    font-family: Arial, "Microsoft YaHei", sans-serif;   
}   
/* bad */  
body {   
    font-family: arial, sans-serif;   
}   
h1 {   
    font-family: Arial, "Microsoft YaHei", sans-serif;   
}
Nach dem Login kopieren


4.2 字号
[强制] 需要在 Windows 平台显示的中文内容,其字号应不小于 12px。
解释:由于 Windows 的字体渲染机制,小于 12px 的文字显示效果极差、难以辨认。
4.3 字体风格
[建议] 需要在 Windows 平台显示的中文内容,不要使用除 normal 外的 font-style。其他平台也应慎用。
解释:
由于中文字体没有 italic 风格的实现,所有浏览器下都会 fallback 到 obilique 实现 (自动拟合为斜体),小字号下 (特别是 Windows 下会在小字号下使用点阵字体的情况下) 显示效果差,造成阅读困难。

5 变换与动画
[强制] 使用 transition 时应指定 transition-property。
示例:

/* good */  
.box {   
    transition: color 1s, border-color 1s;   
}   
/* bad */  
.box {   
    transition: all 1s;   
}
Nach dem Login kopieren


[建议] 尽可能在浏览器能高效实现的属性上添加过渡和动画。
解释:
见本文,在可能的情况下应选择这样四种变换:

transform: translate(npx, npx);   
transform: scale(n);   
transform: rotate(ndeg);   
opacity: 0..1;
Nach dem Login kopieren


典型的,可以使用 translate 来代替 left 作为动画属性。
示例:

/* good */  
.box {   
    transition: transform 1s;   
}   
.box:hover {   
    transform: translate(20px); /* move right for 20px */  
}   
/* bad */  
.box {   
    left: 0;   
    transition: left 1s;   
}   
.box:hover {   
    left: 20px; /* move right for 20px */  
}
Nach dem Login kopieren


6 响应式
[强制] Media Query 如果有多个逗号分隔的条件时,应将每个条件放在单独一行中。
示例:

@media   
(-webkit-min-device-pixel-ratio: 2), /* Webkit-based browsers */  
(min--moz-device-pixel-ratio: 2),    /* Older Firefox browsers (prior to Firefox 16) */  
(min-resolution: 2dppx),             /* The standard way */  
(min-resolution: 192dpi) {           /* dppx fallback */  
    /* Retina-specific stuff here */  
}
Nach dem Login kopieren


7.CSS注释
普通注释

/* 普通注释 */
Nach dem Login kopieren


区块注释

/**  
 * 模块:m-detail  
 * author: xxx  
 * edit:   2016.5.02  
 */
Nach dem Login kopieren


8.CSS命名规范
8.1命名组成
命名必须由单词,中划线组成。例如:.info,.news-list
不推荐使用拼音来作为样式名,尤其是缩写的拼音、拼音与英文的混合
所有命名都使用小写,使用中划线 “-” 作为连接字符,而不是下划线 “_“
8.2命名前缀

前缀说明示例
g-全局通用样式命名g-mod
m-模块命名方式m-detail
ui-组件命名方式ui-selector
j-所有用于纯交互的命名,不涉及任何样式规则。J-switch


不允许出现以类似:.info, .current, .news 开头的选择器,比如:

.info{sRules;}
Nach dem Login kopieren

因为这样将给我们带来不可预知的管理麻烦以及沉重的历史包袱。你永远也不会知道哪些样式名已经被用掉了,如果你是一个新人,你可能会遭遇,你每定义个样式名,都有同名的样式已存在,然后你只能是换样式名或者覆盖规则。所以我们推荐这样写:

.m-xxx .info{sRules;}
Nach dem Login kopieren

所有的选择器必须是以 g-, m-, ui- 等有前缀的选择符开头的,意思就是说所有的规则都必须在某个相对的作用域下才生效,尽可能减少全局污染。 J- 这种级别的className完全交由JSer自定义,但是命名的规则也可以保持跟重构一致,比如说不能使用拼音之类的

8.3命名单词
不以表现来命名,而是根据内容来命名。比如:left, right, center, red, black这种以表现来定命名,不允许出现;
推荐使用功能和内容相关词汇的命名,如:
全选复制放进笔记套系:package
相册:photo-album
作品:works
攻略:raiders
普通用户:normal-user
达人:talent-user
摄影师:photographer
用户昵称:user-alias
头像:head
地区:area
关注数:follow
粉丝数:followers
互相注意:attention
标签:label
发表时间:publish-date,publish-time
标题:title
信息:info
内容:content
关于我:about
简介内容:intro-content
评论:review
服务:service
封面:cover
流行:popular
收藏:collect
查看:view
预约:reservation
促销:sale-promotion

9.兼容性
9.1 属性前缀
[强制] 带私有前缀的属性由长到短排列,按冒号位置对齐。
解释:
标准属性放在最后,按冒号对齐方便阅读,也便于在编辑器内进行多行编辑。
示例:

.box {   
    -webkit-box-sizing: border-box;   
       -moz-box-sizing: border-box;   
            box-sizing: border-box;   
}
Nach dem Login kopieren


9.2 Hack
[建议] 需要添加 hack 时应尽可能考虑是否可以采用其他方式解决。
解释:
如果能通过合理的 HTML 结构或使用其他的 CSS 定义达到理想的样式,则不应该使用 hack 手段解决问题。通常 hack 会导致维护成本的增加。
[建议] 尽量使用 选择器 hack 处理兼容性,而非 属性 hack。
解释:
尽量使用符合 CSS 语法的 selector hack,可以避免一些第三方库无法识别 hack 语法的问题。
示例:

/* IE 7 */  
*:first-child + html #header {   
    margin-top: 3px;   
    padding: 5px;   
}   
/* IE 6 */  
* html #header {   
    margin-top: 5px;   
    padding: 4px;   
}
Nach dem Login kopieren


[建议] 尽量使用简单的 属性 hack。
示例:

.box {   
    _display: inline; /* fix double margin */  
    float: left;   
    margin-left: 20px;   
}   
.container {   
    overflow: hidden;   
    *zoom: 1; /* triggering hasLayout */  
}
Nach dem Login kopieren


Das obige ist der detaillierte Inhalt vonStudienführer zu CSS-Code-Schreibstandards. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So verwenden Sie die Bootstrap -Taste So verwenden Sie die Bootstrap -Taste Apr 07, 2025 pm 03:09 PM

Wie benutze ich die Bootstrap -Taste? Führen Sie Bootstrap -CSS ein, um Schaltflächenelemente zu erstellen, und fügen Sie die Schaltfläche "Bootstrap" hinzu, um Schaltflächentext hinzuzufügen

So ändern Sie Bootstrap So ändern Sie Bootstrap Apr 07, 2025 pm 03:18 PM

Um die Größe der Elemente in Bootstrap anzupassen, können Sie die Dimensionsklasse verwenden, einschließlich: Einstellbreite:.

So fügen Sie Bilder auf Bootstrap ein So fügen Sie Bilder auf Bootstrap ein Apr 07, 2025 pm 03:30 PM

Es gibt verschiedene Möglichkeiten, Bilder in Bootstrap einzufügen: Bilder direkt mit dem HTML -IMG -Tag einfügen. Mit der Bootstrap -Bildkomponente können Sie reaktionsschnelle Bilder und weitere Stile bereitstellen. Legen Sie die Bildgröße fest und verwenden Sie die IMG-Fluid-Klasse, um das Bild anpassungsfähig zu machen. Stellen Sie den Rand mit der img-beliebten Klasse ein. Stellen Sie die abgerundeten Ecken ein und verwenden Sie die IMG-Rund-Klasse. Setzen Sie den Schatten, verwenden Sie die Schattenklasse. Größen Sie die Größe und positionieren Sie das Bild im CSS -Stil. Verwenden Sie mit dem Hintergrundbild die CSS-Eigenschaft im Hintergrund.

So richten Sie das Framework für Bootstrap ein So richten Sie das Framework für Bootstrap ein Apr 07, 2025 pm 03:27 PM

Um das Bootstrap -Framework einzurichten, müssen Sie die folgenden Schritte befolgen: 1. Verweisen Sie die Bootstrap -Datei über CDN; 2. Laden Sie die Datei auf Ihrem eigenen Server herunter und hosten Sie sie. 3.. Fügen Sie die Bootstrap -Datei in HTML hinzu; 4. Kompilieren Sie Sass/weniger bei Bedarf; 5. Importieren Sie eine benutzerdefinierte Datei (optional). Sobald die Einrichtung abgeschlossen ist, können Sie die Grid -Systeme, -Komponenten und -stile von Bootstrap verwenden, um reaktionsschnelle Websites und Anwendungen zu erstellen.

So laden Sie Dateien auf Bootstrap hoch So laden Sie Dateien auf Bootstrap hoch Apr 07, 2025 pm 01:09 PM

Die Datei -Upload -Funktion kann über Bootstrap implementiert werden. Die Schritte sind wie folgt: Startstrap CSS und JavaScript -Dateien einführen; Dateieingabefelder erstellen; Datei -Upload -Schaltflächen erstellen; Behandeln Sie Datei -Uploads (verwenden Sie FormData, um Daten zu sammeln und dann an den Server zu senden). benutzerdefinierter Stil (optional).

So überprüfen Sie das Bootstrap -Datum So überprüfen Sie das Bootstrap -Datum Apr 07, 2025 pm 03:06 PM

Befolgen Sie die folgenden Schritte, um Daten in Bootstrap zu überprüfen: Führen Sie die erforderlichen Skripte und Stile ein. Initialisieren Sie die Datumsauswahlkomponente; Legen Sie das Data-BV-Datatattribut fest, um die Überprüfung zu ermöglichen. Konfigurieren von Überprüfungsregeln (z. B. Datumsformate, Fehlermeldungen usw.); Integrieren Sie das Bootstrap -Verifizierungs -Framework und überprüfen Sie automatisch die Datumseingabe, wenn das Formular eingereicht wird.

Wie entferne ich den Standardstil in der Bootstrap -Liste? Wie entferne ich den Standardstil in der Bootstrap -Liste? Apr 07, 2025 am 10:18 AM

Der Standardstil der Bootstrap -Liste kann mit CSS -Override entfernt werden. Verwenden Sie spezifischere CSS -Regeln und -Sektors, befolgen Sie das "Proximity -Prinzip" und das "Gewichtsprinzip" und überschreiben Sie den Standardstil des Bootstrap -Standards. Um Stilkonflikte zu vermeiden, können gezieltere Selektoren verwendet werden. Wenn die Überschreibung erfolglos ist, passen Sie das Gewicht des benutzerdefinierten CSS ein. Achten Sie gleichzeitig auf die Leistungsoptimierung, vermeiden Sie eine Überbeanspruchung von! Wichtig und schreiben Sie prägnante und effiziente CSS -Code.

So setzen Sie die Bootstrap -Navigationsleiste So setzen Sie die Bootstrap -Navigationsleiste Apr 07, 2025 pm 01:51 PM

Bootstrap bietet eine einfache Anleitung zum Einrichten von Navigationsleisten: Einführung der Bootstrap -Bibliothek zum Erstellen von Navigationsleistencontainern Fügen Sie Markenidentität hinzu. Erstellen Sie Navigationslinks. Hinzufügen anderer Elemente (optional) Anpassungsstile (optional).

See all articles