Wie kann ich feststellen, welche CSS-Medientyp ist auf meiner Seite angefordert wird?

StackOverflow https://stackoverflow.com/questions/3941015

  •  30-09-2019
  •  | 
  •  

Frage

Ich bin auf der Suche, wie mein asp .net Webseite zu ändern, ist Ausgabe an den Browser auf dem CSS-Medien abhängig Typ verwendet wird.

Auch wenn die CSS-Regel kümmert sich um die Unterschiede im Aussehen zwischen Bildschirm und Druckmodus möchte ich auch einige kleinere Anpassungen an die Markup machen, wenn Druckmodus erforderlich ist. Ich würde einfach einen gefloatete Abschnitt unten seine Geschwister fallen lassen und nicht als 2 col Ansatz, die während der Bildschirm-Layouts im Browser verwendet wird.

War es hilfreich?

Lösung

Dies ist nicht möglich. Kein Browser macht diese Informationen in einer Art und Weise, die Sie auf der Server-Seite ändern Markup lassen (das heißt bevor sie an den Browser gesendet wird).

Der Browser kann bestimmen, welche CSS nach verwenden, um was es geht mit dieser Seite (Druck, Display, lesen ...) zu tun, aber man kann nicht wissen, welche es sein wird.

Betrachten Sie Ihre Markup ändern, so wird es auch css sowohl mit Druck und Bildschirm arbeiten.

Ein andere Möglichkeit ist es, einen print Link zu erstellen, die zu einem Druck optimierte Version der Seite verlinkt werden.

Andere Tipps

Nicht eine sehr schöne Methode, aber man konnte nur in dem getriebenen Abschnitt hinzufügen unten seine Geschwister und versteckt diesen Abschnitt im Screen CSS-Datei. Dann in der Print CSS-Datei Sie diesen verborgenen Abschnitt zeigen könnten, und verstecken die andere, die Sie nicht dann in der Druckseite wollen.

Dies würde dazu führen, dass zusätzliche Seite html haben, aber je nachdem, was dieser gefloatete Abschnitt ist, könnte es eine Option sein.

Wenn Ihr Markup in dieser Reihenfolge geschrieben, um Ihre Spalt zu schweben, aber das tatsächliche Format des Dokuments macht mehr Sinn, eine andere Art und Weise rund, müssen Sie Ihren Markup und Ihren Bildschirm CSS beheben.

MNarkup sollte nicht auf CSS abhängig sein. Markieren Sie Ihr Dokument zunächst so, dass es Sinn ohne die CSS macht -, die zwischen den Zeilen lesen, ist so, wie Sie es wollen, für den Druck angezeigt werden soll. Sobald Sie das getan haben, Stil das Spaltenlayout auf dieser Quelle Reihenfolge basiert.

Also Ihr Ziel, eine Browser-Seite, dass imitiert „Druckvorschau“ zu präsentieren war? Wie bereits beantwortet, wird der Browser den Medientyp nicht aussetzen, so dass es nicht möglich ist, dass vor der Zeit fragen Sie die Ausgabe an den Browser zu ändern. In Ihrem speziellen Fall, mein Verständnis von W3C-Dokumenten ist, dass der ‚Druck‘ Medientyp ist nur ausgelöst für „ausgelagerten Material und auf dem Bildschirm in der Druckvorschau-Modus betrachtet Dokumente.“ Gemeint ist die einzige Möglichkeit, den ‚Druck‘ Medientyp für die Bildschirmanzeige zu aktivieren, wählen ‚Vorschau Drucken‘ sowieso.

Natürlich, wenn Sie sind in ‚Druckvorschau‘, Medien-Anfragen mit einem veränderten Layout funktioniert gut zu sehen. Hier ist ein super einfaches Beispiel, das tut, was Sie tun wollten:

Die Stile: 

<style>
ul li {
    float:left;
    margin: 10px;
}
@media print {
    li#printfloat {
        clear:left;
    }
}
</style>

und die HTML: 

<ul>
    <li>Sibling 1</li>
    <li id="printfloat">Sibling 2</li>
</ul>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top