Bootstrap 4: So binden Sie ein Hintergrundbild ohne CSS ein

Question

Bootstrap definiert CSS-Klassen, um die gängigsten Designelemente von Websites abzudecken. Ich kann jedoch nicht herausfinden, wie ich mithilfe von Bootstrap-Klassen eine Hintergrundbilddatei angeben kann, ohne umständliches, benutzerdefiniertes CSS hinzuzufügen.

Answer 1

Sie müssen die Eigenschaft background-image:url(''); mit Stil angeben, um den Pfad des Bildes anzugeben, und Sie können das Bild mit der Klasse .bg-image responsiv machen.
So können Sie das tun:
Fügen Sie das Hintergrundbild über Inline-CSS hinzu.
Fügen Sie die Klasse .bg-image hinzu, um das Bild richtig zu skalieren und die Reaktionsfähigkeit zu aktivieren.
Beispiel:

<div class="bg-image" 
     style="background-image: url('https://i.postimg.cc/ZnHTP71s/aircraft-airplane-boat-1575833.jpg');
            height: 100vh">
</div>

vh steht für Viewport Height.
Hier bedeutet height:100vh 100 % der verfügbaren Höhe.