Comment puis-je déterminer quel type de support css est demandé sur ma page?

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

  •  30-09-2019
  •  | 
  •  

Question

Je cherche à modifier la façon dont mon asp page web .net est sortie au navigateur en fonction du type utilisé les médias css.

Bien que la Stratégie est généralement de prendre soin des différences d'apparence entre l'écran et le mode d'impression, je voudrais aussi faire quelques ajustements mineurs au balisage lorsque le mode d'impression est nécessaire. Je voudrais simplement être la suppression d'une section flotta au-dessous de ses frères et soeurs plutôt que comme une approche 2 col qui est utilisé lors de la présentation de l'écran dans le navigateur.

Était-ce utile?

La solution

Ceci est impossible. Aucun navigateur expose ces informations d'une manière qui vous permettra de changer le balisage du côté du serveur (à savoir avant d'envoyer au navigateur).

Le navigateur peut déterminer les CSS à utiliser en fonction de ce qu'il va faire avec cette page (impression, affichage, lecture ...), mais vous ne pouvez pas savoir que ce sera.

Pensez à modifier le balisage afin qu'il fonctionne bien à la fois l'écran et l'impression css.

Une autre option consiste à créer un lien de print qui reliera à une impression version optimisée de la page.

Autres conseils

pas une méthode très agréable, mais vous pouvez simplement ajouter dans la section flotta au-dessous de son frère et de cacher cette section dans le fichier CSS de l'écran. Puis dans le fichier CSS d'impression, vous pouvez montrer cette section cachée et cacher l'autre que vous ne voulez pas alors dans la page d'impression.

Ceci provoquerait votre page d'avoir un fichier HTML supplémentaire, mais en fonction de ce que cette section est taloché, il pourrait être une option.

Si votre balisage est écrit dans cet ordre afin de flotter votre colonne, mais le format réel du document est plus logique une ronde de manière différente, vous devez corriger votre balisage et votre CSS écran.

MNarkup ne doit pas dépendre de CSS. Marquez votre premier document afin qu'il est logique sans le CSS - qui, en lisant entre les lignes, est la façon dont vous souhaitez l'afficher pour l'impression. Une fois que vous avez fait cela, le style de la mise en page de colonne en fonction de cet ordre source.

Donc, votre objectif était de présenter une page de navigateur qui imite « Aperçu avant impression »? Comme déjà répondu, le navigateur ne pas exposer le type de support, il est donc impossible d'interroger que l'avance pour modifier la sortie du navigateur. Dans votre cas, ma compréhension du W3C docs est que le « print » type de média est uniquement déclenché pour « paginée matériel et des documents consultés à l'écran en mode aperçu avant impression. » Signification la seule façon d'activer le type de support « impression » pour l'affichage de l'écran est de choisir « Aperçu avant impression » de toute façon.

Bien sûr, une fois que vous êtes dans « Aperçu avant impression », en utilisant des requêtes des médias pour voir une mise en page modifiée fonctionne très bien. Voici un exemple de super simple qui fait ce que vous vouliez faire:

Les styles: 

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

et le code HTML: 

<ul>
    <li>Sibling 1</li>
    <li id="printfloat">Sibling 2</li>
</ul>
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top