Gleiche Eigenschaften in einer Klasse

Gibt es einen Nachteil in diesem Beispiel?Gleiche Eigenschaften in einer Klasse

.class { 
    max-height: 500px; 
    max-height: 50vh; 
}

Ich möchte, dies zu tun, denn wenn vh nicht in einem Browser unterstützt wird, wird dieser Browser max-height: 500px; anwenden und die Linie der vh ignorieren. Keine

Quelle

2017-09-22 user2970115

Ich würde vorschlagen, dass Sie [Sass] (http://sass-lang.com/) anstelle von CSS verwenden, dort können Sie Bedingungen haben. Oder vielleicht in css probiere etwas mit @media. –

Das ist absolut in Ordnung. Sie sind kaskadierend, also gewinnt immer der letzte (unterstützte) Stil mit der gleichen Wichtigkeit. Es ist ein häufiger Fall, einige CSS-Regeln durch eine andere Klasse zu überschreiben, sodass der Browser mehrere Instanzen derselben Eigenschaft zur Auswahl hat. Warum sollte das nicht in derselben Klasse erlaubt sein? Abgesehen von der zusätzlichen Codezeile sehe ich keine Nachteile, aber wenn Sie alte Browser unterstützen müssen, benötigen Sie einen Fallback.

Ich nehme an, Sie wissen, dass 500px nicht immer die gleiche Breite/Höhe wie 50vw/vh sein wird, also ja, ein Nachteil wäre, dass es in älteren Browsern anders aussieht. Aber aus syntaktischer Sicht ist nichts falsch.

Quelle

2017-09-22 08:59:35

Die vh wird Priorität haben (denn es ist der letzte max-height in der CSS-Datei), aber nur, wenn es in dem aktuellen Browser nicht unterstützt. Aber vh ist in vielen Browser (93,19%) unterstützt:

https://caniuse.com/#search=vh

für mich So ist es in Ordnung, und ich habe nie über eine schlechte Verwendung von mehreren gleichen Eigenschaften in einer Klasse

Quelle

2017-09-22 08:48:58

Ich denke hören Es gibt einen Link, der Ihnen helfen kann. How to write css fallbacks for vh vw Wenn Browser auf eine Eigenschaft oder einen Wert stoßen, den sie nicht verstehen, ignorieren sie ihn und gehen weiter.

Quelle

2017-09-22 08:50:50 nabanita

OP's Sorge ist, ob man sie benutzt oder nicht, wenn ja warum? – bhansa

Ja. Es gibt einen Nachteil. 50vh hängen vom Ansichtsfenster des Gerätes ab und es ist gleich dem 50% des Ansichtsfensters, wo wie der 500px der Pixelwert des Geräts gleichzeitig nicht gleich ist.

zweitens, wenn der Browser die letzte unterstützt, d. H. 50vh.

Ich hoffe, Sie verstehen meinen Standpunkt. Für jede Frage bitte Kommentar. Alles Gute.

Quelle

2017-09-22 08:59:10

genau das, was ich tun möchte, wird die Zeile von px verwendet, wenn vh von einem alten Browser nicht unterstützt wird. Also ich denke, das ist kein Nachteil? – user2970115

ist es schon okay einen Ausweich für Browser zur Verfügung zu stellen, die nicht vh oder vw unterstützt.

h1 { 
    font-size: 36px; /* Some tweener fallback that doesn't look awful */ 
    font-size: 5.4vw; 
}

Es ist nichts falsch daran, wenn Modernizr diese Prüfung bereits verwendet es für nicht unterstützten Browser zu überprüfen.

Die von Ihnen verwendeten Messwerte hängen von Ihrem Fenster und Objektgröße ab. Betrachten Sie beide gleichzeitig px und vh.

Quelle

2017-09-22 09:00:03 bhansa

Gleiche Eigenschaften in einer Klasse

Antwort

Verwandte Themen