溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
今天小編給大家分享一下CSS打印時怎么更改屏幕設計和樣式的相關知識點，內容詳細，邏輯清晰，相信大部分人都還太了解這方面的知識，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來了解一下吧。
index.html
<!DOCTYPEhtml>
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title></title>
<metacharset="utf-8"/>
<linkrel="stylesheet"href="style.css"type="text/css"media="screen"/>
<linkrel="stylesheet"href="print.css"type="text/css"media="print"/>
</head>
<body>
<divclass="MenuFrame">
菜單1<br/>
菜單2<br/>
菜單3<br/>
菜單4<br/>
菜單5<br/>
菜單6<br/>
</div>
<divclass="ContentsFrame">
<h3>題記</h3>
<p>內容</p>
<p>
竹外桃花，紛紛飄落。卿舞霓裳，君彈曲。高山流水，繞指尖幽幽蕩漾。執一葉扁舟，在歲月的河流上，演繹一場不離散的笙歌，可好……——題記
猶記曾經，君襲一屢白衣，從陌上花開的小徑款款而來，桃花灼灼，驚起了我的一簾幽夢。從此，詩詞歌賦，煙雨桃花，都失去了色彩，只有君的身影，絲絲抨擊著心海。
</p>
<h3>第一段</h3>
<p>內容</p>
<p>
不再嘆天若有情，不再盼三寸天堂。只因這素潔的紅塵有了你的陪伴，相思惹起了無邊的牽盼。情到深處無怨尤，不想，與君共享人世繁華，只愿，流年今夕，共看云卷云舒，花開花落。
初相見，驚素心。你來時，陌上花開，紛繁的花瓣，燦爛了我的眼眸。縱使，東風惡，人情薄，煙花不堪剪。</p>
<h3>第二段</h3>
<p>內容</p>
<p>
仍愿為你，嘗盡這無邊的相思之苦。也許，我就是你千百年前放走的白狐，今生，只為你醉，只為你舞。君可知，那天空飄落的雪花呀，就是我對你深深的思念。那日，你說。凡塵寂寥，不能遺忘遠方的夢想。山一程，水一程，你離開了這個令我百轉千回的相思地。
一年一度秋風近，風兒翩翩吹起來。此時，橋邊的芍藥，正生的紅艷，梨花艷艷地開著。熟悉的地方，陌生的氛圍，卻沒有了你的蹤影。日日思君不見君，即使花艷又如何。</p>
</div>
<divclass="ClearLeft"></div>
</body>
</html>
screen.css
.MenuFrame{
width:200px;
float:left;
background-color:#fff8aa;
color:#ff6a00;}
.ContentsFrame{
float:left;
width:600px;
background-color:#ededed;
color:#535353;
}
.ClearLeft{
clear:left;
}
print.css
.MenuFrame{
display:none;
}
.ContentsFrame{
width:100%;
}
.ClearLeft{
clear:left;
}
說明：
在Web瀏覽器中正常顯示的情況下，應用style.css的樣式表。打印時，應用帶有media=“print”的print.css。在print.css中，左側的MenuFrame被隱藏，它變為1級顯示。此外，ContentsFrame的寬度假定為100％，并且將根據紙張的寬度進行布局。此外，通過使角色的顏色不明確，我們將其設置為黑色字母的白色背景。
以上就是“CSS打印時怎么更改屏幕設計和樣式”這篇文章的所有內容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會為大家更新不同的知識，如果還想學習更多的知識，請關注億速云行業資訊頻道。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
