媒體打印CSS

我目前在CSS中使用媒體查詢，我之前沒有使用媒體打印。在定義了@media print的文件的按鈕處，是否可以刪除所有格式而不必複製所有元素？爲了簡潔，我刪除了大部分樣式規則。媒體打印CSS

是的，這是一個任務，我的問題超出了班級的範圍，只是形成我個人的知識。

nav.sitenavigation { 
 
\t color: yellow; 
 
\t background-color: rgb(241,90,36); 
 
\t text-align: center; 
 
} 
 
nav.sitenavigation p{ 
 
\t display: inline-block; 
 
\t margin: .4em .6em; 
 
\t font-size: 1.6em; 
 
} 
 
nav.sitenavigation a:link{ 
 
\t text-decoration: none; 
 
\t color: yellow; 
 
\t 
 
} 
 
nav.sitenavigation a:visited { 
 
\t color: white; 
 
} 
 
nav.sitenavigation a:hover { 
 
\t color: yellow; 
 
\t text-shadow: 1px -1px 0 black; 
 
} 
 
nav.sitenavigation a:focus { 
 
\t color: yellow; 
 
\t text-shadow: 1px -1px 0 black; 
 
} 
 
nav.sitenavigation a:active { 
 
\t position: relative; 
 
\t top: 1px; 
 
\t left: 1px; 
 
} 
 

 
/* body and page container */ 
 
body { 
 
    font-family: Lato, Arial, Helvetica, sans-serif; 
 
    background-color: #faebbf; 
 
} 
 
.container { 
 
    max-width: 800px; 
 
    margin: 0 auto; 
 
    background-color: #6ac238; 
 
    position: relative; 
 
} 
 
/* Skip Nav section */ 
 
p.skipnavigation { 
 
\t position: absolute; 
 
\t left: -10000px; 
 
} 
 
p.skipnavigation a:focus { 
 
\t color: black; 
 
\t background-color: white; 
 
\t position: relative; 
 
\t top: .4em; 
 
\t left: auto; 
 
\t right: .4em; 
 
\t z-index: 2; 
 
} 
 
/* print styles */ 
 
@media print { 
 
    .container, h1, h2, header, header p, nav p, nav, div, article, p.sitenavigation, nav.sitenavigation, nav.sitenavigation a:visited , p.skipnavigation a:focus, nav.sitenavigation a:link { 
 
     color: black; 
 
     background-color: white; 
 
    } 
 
} 
 
@page { 
 
    margin: 1in; 
 
}

來源

2016-10-19 William

剝離所有格式可能不是你想要的東西 - 嘗試，但相信它會看起來很奇怪。對於初學者，你可能更適合剝離特定的風格，如* { background: none transparent; color: #000; }。 *選擇器將針對所有內容，因此請謹慎使用。

如果你真的要刪除各種風格，有* { all: unset }或* { all: initial } - 這些都略有不同的行爲，但要知道，browser support for all isn't perfect。

你也可以看看那裏的各種css重置，這些重置會去除或標準化大多數樣式。

來源

2016-10-19 14:53:55 jack

當我有空時，我將不得不更詳細地瞭解這一點。乍一看這可能會更有用，我確實看到Safari和IE不支持。 – William

我認爲你不能這樣做純粹的CSS。還有其他更簡單的方法來製作SCSS，代碼更乾淨。

另一種方法是，您是否將特定文件上傳到打印介質，這樣您就可以集中某種類型屏幕的所有樣式，從而便於維護。

事情是這樣的：

<link rel="stylesheet" media="print" href="http://foo.com/mystyle.css" />

欲瞭解更多信息，look here。

我以某種方式提供了幫助。

來源

2016-10-19 15:06:06

我想我沒有指定我的意圖，我正在看它將它發送到打印機。 HTML格式化的方式在打印時不會有用。 – William

媒體打印CSS

回答

相關問題