25.09.2016 Verschiedene Hinweise zu Lerndetails-HTML-Tutorial-php.cn

25.09.2016 Verschiedene Hinweise zu Lerndetails

WBOY

Freigeben： 2016-09-26 08:27:17

Original

954 Leute haben es durchsucht

Unter normalen Umständen ist es schneller, ein responsives Layout mit Bootstrap zu schreiben als mit nativem Code

Ergänzung zum vorherigen Artikel „Praktische Anwendung von Bootstrap“:

bootstrap的lang ：<html lang="zh-CN"> 之前班上很多同学忘了改这个 原生的lang为 <html lang="en"><br>由于bootstrap本质是已经写好了固定的css的样式 所以要修改从bootstrap复制过来的内容时 请在 例如：

Nach dem Login kopieren

<button type="button" class="btn btn-default" style="height: 1.875rem;border: none;">微信登录</button>  里修改  也就是 内联<br>才会起作用  如果你自己本身用的外联link XXXX 的css样式想去修改bootstrap复制过来的某个东西时 起不了作用

Nach dem Login kopieren

Auf der Webseite muss auf Kompatibilität geachtet werden, um sie an verschiedene Browser anzupassen. Es können häufig mehrere Sätze von Sprite-Bildern verwendet werden

Die App hat unterschiedliche Bildschirmgrößen und muss angepasst werden {@media srceen oder Bootstrap oder JS} werden auch oft verwendet

* Sprite-Bilder können die Ladegeschwindigkeit von Webseiten verbessern und mehrere Bilder in einem integrieren

* Bei adaptiven Arbeiten muss die Breite ein Prozentsatz sein, und die Höhe sollte auch ein Prozentsatz sein. Wenn dies unvermeidbar ist, verwenden Sie am besten einen Prozentsatz

* Das mobile Endgerät muss einen Meta-Ansichtsbereich hinzufügen

Benutzer dürfen nicht zoomen

Konvertierung der Schriftgröße für verschiedene Bildschirmgrößen von Mobiltelefonen

@media screen und (min-width: 1242px){html{font-size: 38.8125px;}}

@media screen und (min-width: 960px){html{font-size: 30px;}} @media screen und (max-width: 750px){html{font-size: 23.4375px;}}
@media screen und (max-width: 640px){html{font-size :20px;}}
@media screen und (max-width: 414px){html{font-size:12.9375px;}}
@media screen und (max-width: 360px){html{font- size:11.25px;}}
@media screen und (max-width: 320px){html{font-size:10px;}}

Wenn Sie Bilder verwenden, wickeln Sie das Bild mit div ein und setzen Sie das Bild nicht direkt dem Körper aus

Anmutiges Downgrade

Beginnen Sie mit der Erstellung von Webseiten in Browsern mit guter Kompatibilität und passen Sie sich langsam an Browser mit schlechter Kompatibilität an

Nach und nach verbessern

Zu Beginn werden alle Browser- und Bildschirmanpassungen vorgenommen, jedoch nur die Grundfunktionen, und dann wird der Inhalt langsam ausgefüllt

Container im Bootstrap hat eine feste Breite von 100 %

Wenn das Attribut „Position fest“ auf die Navigation und das Ende angewendet wird, verwenden Sie beim Positionieren des mittleren Inhalts keine Positionierung und verwenden Sie einen Rand oder Abstand, um den Abstand zu unterstützen. Andernfalls wird das positionierte Element über der festen Navigation und dem Block angezeigt die Navigation. Absolut und relativ. Sie können die Ergebnisse nicht verwenden, Sie können es selbst testen.....