私は現在、CSSでメディアクエリを使用しています。以前はメディアプリントを使用していませんでした。 @media printが定義されているファイルのボタンで、すべての要素をコピーせずにすべての書式を削除する方法はありますか?簡略化のためにほとんどのスタイルルールを削除しました。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;
}
私は時間があるときこれをもっと詳しく調べなければなりません。一見これはより有用かもしれません、私はSafariとIEがこれでサポートされていないことを知りました。 – William