鍍金池/ 問答/Java  PHP  Python  C  HTML/ 如何修改瀏覽器默認的打印樣式，通過css修改不起作用，如下圖

如何修改瀏覽器默認的打印樣式，通過css修改不起作用，如下圖

各瀏覽器默認打印樣式

IE

clipboard.png

Google Chrome

clipboard.png

Mozilla Firefox

clipboard.png

問題

通過css樣式修改不起作用

內(nèi)嵌

clipboard.png

外聯(lián)

clipboard.png

想要的效果

紅色框內(nèi)的內(nèi)容刪除，綠色框的頁碼在底部居中
clipboard.png

完整代碼

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
    <title>學(xué)云課堂-教師端</title>
    <link rel="stylesheet" href="css/reset.css"/>
    <link rel="stylesheet" href="css/app.css"/>
    <link rel="stylesheet" href="css/print.css" media="print" />
    <style>
        @media print {
            #nav, #sidebar, #advertising, #search {

                display: none!important;

            }
        }
    </style>
    <script>document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';</script>
</head>
<body>
<header class="app-header">
    <div class="header-left">
        <img src="image/header_go_back.png" alt="img"/>
    </div>
    <div class="header-center">關(guān)于</div>
    <div class="header-right"></div>
</header>
<section class="app-about">
    <div class="about-header">
        <img src="image/about_logo.png" alt="img" class="header-img"/>
        <p class="header-text">丑板凳老師版</p>
    </div>
    <ul class="about-body">
        <li class="body-item">
            <span class="item-left">版本號</span>
            <span class="item-right">v1.1.2</span>
        </li>
        <li class="body-item">
            <span class="item-left">給丑板凳評分</span>
            <img class="item-right" src="image/more.png" alt="img"/>
        </li>
        <li class="body-item">
            <span class="item-left">客服電話</span>
            <span class="item-right">0756-28621335</span>
        </li>
    </ul>
    <p class="about-footer">
        ?2018 丑板凳 All Rights Reserved.
    </p>
</section>

</body>
</html>
回答
編輯回答
爆扎

@media不會改變css的優(yōu)先級，你需要確保這部分的css是優(yōu)先級最高的，或者加!important

2017年1月19日 01:10
編輯回答
瘋子范

你使用這接各print css瀏覽器暫時不支持呢

2017年8月13日 09:29