Wie kann man das endgültig berechnete CSS anzeigen, einschließlich Überschreibungen wie Einstellungen für hohen Kontrast?

1674
vpram86

Gibt es ein solches Werkzeug? Ich möchte zum Beispiel alle für das BODY-Tag angewendeten Stile sehen. Ich weiß, dass es nicht lesbar ist. In meinem Fall gibt es mehrere Optionen, die CSS dynamisch ändern können, entweder über den Browser oder den Quellcode (JSPs) oder aufgrund von Systemeinstellungen wie dem Hochkontrastmodus usw. Ich möchte die endgültigen Stile, mit denen die Seite so dargestellt wurde wird gezeigt. Bitte vorschlagen

BEARBEITEN: Wenn ich ein Tool bekomme, das auch IE6 unterstützt, wäre das großartig. Weil die Seite, die ich besitze, dort öfter als alle anderen Browser angezeigt wird.

Vielen Dank & Grüße Prasanna Ram

2
Die Dinge unter http://superuser.com/questions/43280/utility-to-determine-the-font-used-on-asite/ reichen nicht aus? Arjan vor 14 Jahren 1
@Arjan: Wunderbare Verbindung. Vielen Dank! Informiert es mich auch über die Änderungen, die aufgrund von Systemeinstellungen mit hohem Kontrast vorgenommen wurden? vpram86 vor 14 Jahren 0
(Da Sie anscheinend Dinge wie Firebug und Web Inspector mögen, möchten Sie möglicherweise Ihre Frage ändern, um die Anforderung "innerhalb des Tags selbst" zu entfernen, um mehr Aufmerksamkeit auf die strengen Anforderungen zu ziehen.) Arjan vor 14 Jahren 0
@Arjan: Eigentlich wollte ich betonen, dass, unabhängig von den Änderungen, die sich auf der Webseite auswirken, wie bei HC, ich die endgültige Quelle mit Stilen im entsprechenden Tag selbst haben möchte. Es ist das Endergebnis des Werkzeugs, nach dem ich suche. Dies würde mir helfen zu vergleichen und zu sehen, was sich als Teil der HC-Änderung im Betriebssystem ändert und betroffen ist. Aber ich glaube, ich habe es nicht klar genug gemacht. Also entferne ich es besser :). Vielen Dank! vpram86 vor 14 Jahren 0
Bitte geben Sie ein Beispiel für * "Meine Seite verhält sich anders" * und * "Die Seite wird definitiv geändert und der Browser-Browser tut etwas mit unserer Seite in HC" *. Und obwohl ich immer noch nicht glaube, dass es ein solches Tool gibt (da ich glaube, dass der systemweite hohe Kontrast kein CSS beeinflusst), möchten Sie vielleicht den Titel in etwas wie ** ändern. "So zeigen Sie das endgültig berechnete CSS an, einschließlich Überschreibungen wie hohe Kontrasteinstellungen? "**. Oder ** "Kann ich eine Webseite anzeigen, die von jemandem erlebt wird, der Einstellungen für die Einstellung des Kontrasts mit hohem Kontrast erfordert?" ** Oder benötigen Sie etwas anderes? Arjan vor 14 Jahren 0
Nun, ich habe es zu Ihrem ersten Vorschlag geändert. Dank dafür vpram86 vor 14 Jahren 0

4 Antworten auf die Frage

4
quickcel

Haben Sie es mit Firebug versucht ?

Firebug ist in Firefox integriert, um eine Fülle von Web-Entwicklungstools beim Surfen zur Verfügung zu haben. Sie können CSS, HTML und JavaScript in jeder Webseite live bearbeiten, debuggen und überwachen.

Ich wollte Firebug auch empfehlen, aber es zeigt nicht die Änderungen * des css * -Endnutzers an, wie beispielsweise der Modus mit hohem Kontrast oder das Ändern von Webseiten mit greasemonkey. Jared Harley vor 14 Jahren 0
Danke vielmals! Gibt es eine ähnliche für IE? Ich benötige das meistens für IE. vpram86 vor 14 Jahren 0
Sie können versuchen, Firebug Lite (http://getfirebug.com/lite.html) dafür zu verwenden quickcel vor 14 Jahren 0
1
Shevek

Versuchen Sie es mit Chrome - Sie können jeden Teil einer Seite auswählen, mit der rechten Maustaste klicken und "Element prüfen".

Dies zeigt eine Baumstruktur des gesamten Seitencodes, und Sie können das auf jedes Element in der Baumstruktur angewendete CSS sehen

Vielen Dank! Zeigt dies dynamisch starke Kontraständerungen auf Betriebssystemebene? vpram86 vor 14 Jahren 0
1
Arjan

Vom Betriebssystem bereitgestellte Kontrasteinstellungen haben nichts mit CSS zu tun. (Oder bei Browsern: Ein Browser kennt solche Einstellungen nicht und ändert KEIN CSS für systemweite Einstellungen mit hohem Kontrast.) Ich glaube nicht, dass Sie ein Werkzeug finden werden, das das CSS "anpasst" kompensieren Sie die kontrastreichen Einstellungen.

(Vielleicht gibt es Online - Tools, wie Vischeck Sie zeigen können, was Dinge wie jemand aussehen, die farbenblind ist. Wenn aber ein ähnliches Werkzeug vorhanden ist, ich bin eigentlich nicht sicher, wie dass jeder Entwickler helfen würde, die sich nicht mit hohem Kontrast Einstellungen benötigen, bei der Feststellung, ob jemand anderes die Website anzeigen kann ... Ein solches Online-Tool müsste dann für Personen mit normalem Sehvermögen einen hohen Kontrast "umwandeln", um eine Vorstellung davon zu bekommen, was eine sehbehinderte Person erleben würde.)

Vielen Dank, Arjan. Mein Problem ist, dass sich meine Seite für andere Browser in normalen und hohen Kontrasteinstellungen (insbesondere in verschiedenen IE-Versionen) anders verhält. Ich wollte überprüfen, welches Element als Teil der HC-Änderung im Browser betroffen ist, damit ich es stabiler machen kann. vpram86 vor 14 Jahren 0
Aber woher wissen Sie, wie die Augen oder der Geist eines Menschen, der * einen hohen Kontrast benötigt (und daher verwendet), diesen höheren Kontrast tatsächlich interpretieren wird? Ich denke wirklich, dass Sie entweder eine sehbehinderte Person fragen müssen oder ein Online-Tool finden, das den Kontrast für Menschen mit normaler Sehkraft "ausgleicht". (In jedem Fall ist der Browser völlig unbemerkt und ändert sein CSS NICHT für systemweite Einstellungen mit hohem Kontrast.) Arjan vor 14 Jahren 0
@Arjan: Ich verstehe es völlig Arjan. Aber ich wollte nur herausfinden, ob es einen Weg gibt. Die Seite wird definitiv geändert, und Browser-Defintiely tut etwas zu unserer Seite in HC. Ich dachte, es würde irgendwo einen Haken geben, an welchem ​​Element / Stil / Eigenschaft genau dies betroffen ist. Da ich nicht sicher bin, suche ich. vpram86 vor 14 Jahren 0
1
quack quixote

Die Verwendung von Virtual PC [*] (alias "Windows XP-Modus" in Windows 7) (oder einer anderen Lösung für virtuelle Maschinen) ist eine gute Möglichkeit, Webseiten in einer Vielzahl von Browsern und Einstellungen zu testen. Die Idee ist, da Sie IE6 / 7/8 nicht gleichzeitig auf einem einzelnen PC installieren können, können Sie sie zum Testen auf verschiedenen virtuellen Maschinen installieren.

Microsoft bietet mit IE6 / 7/8 unter XP oder Vista vorkonfigurierte VPC-Images . Es handelt sich hierbei um umfangreiche Downloads (etwa 700 MB), die jedoch ein komplettes VPC-Image enthalten, das mit einer bestimmten IE-Version vorkonfiguriert ist und für Tests der Anwendungs- und Website-Kompatibilität konzipiert wurde. Sie sind zeitlich begrenzt und verfallen 120 Tage nach der ersten Verwendung (für die Vista-Images) oder am 1. April 2010 (für die XP-Images (vorausgesetzt, es handelt sich nicht nur um einen Aprilscherz).

Ein Vorteil für Sie: Konfigurieren Sie eine VPC so, dass sie im kontrastreichen Modus ausgeführt wird, und führen Sie sie neben einer anderen VPC aus, die im nicht kontrastreichen Modus (mit derselben IE-Version) ausgeführt wird.

[*] Keine Bestätigung des Virtual PC-Produkts. Sie können dasselbe mit VMware, VirtualBox oder dem Produkt Ihrer virtuellen Maschine tun .

Verwandte Probleme