Ich habe eine kleine Seite zum Spaß gebaut, um mich mit Bootstrap vertraut zu machen.
Das Problem, das ich habe, ist, dass das Logo-Bild nicht reagiert, egal was ich versuche.
Der Code scheint ziemlich einfach zu sein. Ich bin mir sicher, dass ich nur ein kleines Detail vermisse:
%Vor%(Hier ist eine Geige, die das Problem reproduziert) - Ссылка
Entfernen Sie zuerst das Attribut max-width: 184px
aus dem Bild-Tag
Obwohl es besser ist, die Verwendung von Inline-Styling zu vermeiden:
%Vor% %Vor%Wenn die Möglichkeit besteht, dass eines der Elemente des Vorfahrelements stört, können Sie es wie folgt zurücksetzen:
%Vor%Wenn Sie immer noch mit dem Problem konfrontiert sind, wäre der nächste Schritt die Verwendung von JavaScript
%Vor%Dieser Code sollte nach dem Element im Dokument eingefügt werden, andernfalls wird das angegebene Element nicht gefunden, da es noch nicht existiert.
Nachdem Sie nun das Beispiel zu Ihrer Frage hinzugefügt haben, können Sie das Bild durch Ersetzen des folgenden CSS in seine natürliche Größe bringen:
%Vor%Mit diesem CSS:
%Vor%( Demo )
Ich glaube, dass Ihre Verwendung von display: table
Ihr Design beeinträchtigt. Im Folgenden sind zwei Methoden, um das gleiche Layout ohne Hacks zu erreichen.
CSS3-Methode
Alle relevanten modernen Browser unterstützen diese Methode. Wenn Sie also nicht auf Rückwärtskompatibilität mit alten Browsern achten, können Sie diese Methode verwenden.
( Demo )
%Vor% %Vor%Tabellenmethode
Aus Gründen der Abwärtskompatibilität können Sie diese Methode verwenden.
( Demo )
%Vor% %Vor% Versuchen Sie, max-width
auf width: 100%
zu ändern, um 100% der Containerbreite zu übernehmen, aber wenn sich die Containerbreite ändert, ändert sich auch die Größe der Bilder, wobei die Deckung immer 100% beträgt.
Das sollte funktionieren, wenn es mich nicht wissen lässt und ich werde es ein bisschen aushacken. Ich bin gerade auf meinem Telefon, also möchte ich es wirklich nirgends mit einer Bildschirmtastatur sandboxieren. Wenn das nicht funktioniert, werde ich es morgen Nachmittag auf meinem PC aushacken: D!
Ps. Gibt es einen Grund, warum Sie die Klasse .header-logo
in einem Div deklarieren und dann im nächsten Div dieselbe Klasse wieder geben? Ich verstehe, wenn es eine andere Div-Block war, aber das ist im Wesentlichen ein Header-Logo in einem Header-Logo
Tags und Links css twitter-bootstrap