Menu
I am producing a standalone HTML document under the constraint that the document has to be exactly one file. I would like to use CSS to make sure that links in the document are visible and discoverable (probably blue with underlines) when viewed in a browser, but to vanish most of that formatting when the document is printed.
Is this possible with just a <style> block?
Is it possible to get what I want with JavaScript jiggery-pokery?
607
It is not possible to use CSS @media rules and media queries in the inline style attribute as it can only contain property: value pairs. According to the W3 specification, the style attribute's value should match the syntax of contents of a CSS declaration block.
The @media CSS at-rule can be used to apply part of a style sheet based on the result of one or more media queries. With it, you specify a media query and a block of CSS to apply to the document if and only if the media query matches the device on which the content is being used.
An inline style may be used to apply a unique style for a single element. To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property.
You can use @media or @import in a <style> block and set styles specific to the media type.
Read more here: http://www.w3.org/TR/CSS2/media.html
@media print {
/* print styles */
a {color:#333}
}
@media screen {
/* screen only styles */
a {border-bottom:1px solid blue}
}
/* general styles here */
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
