目的 覆盖原网站的浏览器打印CSS,仅保留文章内容,使打印输出的PDF更友好。
步骤 1. Chrome浏览器开启打印预览模式 2. 找到样式文件 3. 追加覆盖样式 4. 右键打印保存为PDF
注意:如果图片作为背景图,需要勾选Background graphics
联合早报 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 header, .bg-gray, .breadcrumb, .d-lg-block *, div.col-lg-4:nth-child(3), #video-info, .article-relative-word, #outbrain-wrapper, footer, #back-top-bar *, .pdb20 > div:nth-child(2), .further-reading, body > div.container > div:nth-child(1), body > div.container > div:nth-child(2) > div.col-lg-7.col-12 > div:nth-child(2) > div div { display: none; } a { text-decoration: none!important; } .col-lg-7 { max-width: 100% !important; flex: auto; } .carousel-item img{ width: 100% !important; height: 100% !important; } .f14 { font-size: 20px; } body { padding-top: 30px; padding-bottom: 10px; } article { font-size: 22px !important; } .author-info { font-size: 20px !important; } .article-title { font-size: 36px !important; } @page{size:a4}
BBC News
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 #main-content>div:not(.ssrcss-1ocoo3l-Wrap), .ssrcss-hhhbpo-ContainerWithSidebarWrapper>div:not(.ssrcss-rgov1k-MainColumn), .ssrcss-rgov1k-MainColumn>div, .ssrcss-2z3pjz-SectionWrapper, footer, .e1nh2i2l0, .teads-inread, #header-content { display: none !important; } /* 使图片不被截断 */ .ssrcss-wpgbih-StyledFigure { page-break-inside: avoid; } .ssrcss-uf6wea-RichTextComponentWrapper { max-width: none; }
Worklife, Future, Culture
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 #orb-banner, #ad-portal, .StickyElement, .article-share-tools, .article__similar-articles, .teads-inread, .article-body-native-ad, .around-the-bbc-swimlane, .article-end__share-tools, .orb-footer, .article-body__image-text, .hero-image, .article-headline__collection { display: none !important } .article__body { max-width: none !important } .article__intro { font-size: 32px } .body-text-card { font-size: 12px } .simple-p-tag--medium { font-size: 14px } .article-body__pull-quote { margin: 10px 0; }
BBC News 中文
图片默认会被截断
文字会截断
正文中的推荐链接没有唯一标识,需要逐个编辑删除
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 .bbc-1fe3qkx, /* 导航菜单 */ .bbc-1dklj5e, /* 顶部广告 */ .bbc-18r23py, /* 简繁切换按钮 */ .bbc-fm4knk, /* 【右侧】推荐内容 */ .bbc-113e14a, /* 【正文】广告 */ .bbc-1km06py, /* 【底部】相关主体 */ .bbc-1u4iszl, /* 【底部】推荐内容 */ .bbc-1s1cxbv, /* 图片上的标识 */ footer { display: none; } /* 使图片不被截断 */ .bbc-1qdcvv9 { page-break-inside: avoid; } /* 可能的推荐链接 */ .e1gggypo0.bbc-oa9drk.e57qer20 { display: none; } /* 字体 */ .bbc-mj7obe { font-size: 12px; padding-bottom: 8px; line-height: 1.5; } .bbc-6w9yzd { font-size: 20px; padding: 8px 0; } .bbc-6yjyco { font-size: 28px; line-height: 1.5; padding: 10px 0; } .bbc-q4ibpr { padding-bottom: 0; } /* logo */ .bbc-fk60et { background: white; } .bbc-fk60et svg { color: black; } /* 【正文】视频、图片 */ .bbc-rl27ak, .bbc-189y18v, .bbc-1ka88fa, .bbc-1bh6w8m { display: none; } @page { margin-bottom: 10; }
CNN 1 2 3 4 5 6 7 8 9 10 #breaking-news-wrapper, #nav, #footer-wrap, #story-bottom, .ad, .pg-rail, .el__embedded { display: none; }
The New York Times
绝大多数内容需要订阅才能浏览,可在订阅窗口出现之前终止浏览器加载绕过此限制。
浏览器打印输出的PDF格式友好,会自动去除广告和保持图片不会被分页截断。
https://nytimes.com/interactive/2017/06/09/movies/the-25-best-films-of-the-21st-century.html
Ctrl + Shift + P
Disable JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 html, body { overflow: auto!important; } .nytd-author.clearfix, .nytd-user-comments, h5.nytd-pullquote, .nytd-related-promo, .g-ad-wrapper, #page-footer, #related-coverage, #BottomAd, #navigation, #mobile-navigation, #gatewayCreative {display: none !important}
纽约时报中文网 广告块较多但命名统一
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 .setting-bar, .big_ad, .article-body-aside, .article-footer, .nav-footer, .download, .article-ribbon, #tbl-taboola-reminder, #topad, .title-bar { display: none !important; } .article-area .article-content .article-header { border-top: none !important; }
The Washington Post 绝大多数内容需要订阅才能浏览,可在页面加载完后删除<html>
标签中的overflow: hidden;
和<body>
标签中的overflow: hidden;position: fixed;
绕过此限制。
路透中文网 路透中文网删除少量广告内容即可有良好的打印输出
1 2 3 4 5 6 7 8 9 10 11 div[class^="AdSlot"], div[class^="TwoColumnsLayout-leaderboard"], div[class^="TwoColumnsLayout-right-column"], div[class^="RelatedArticles-container-gnopT"], nav[class="RegularHeader__nav___30a05"], div[class^="RegularHeader__tools"], div[class^="SocialTools__container"], .RecircRibbon-container-cExim, div[class^="ArticlePage-dianomi"] { display: none; }
日经中文网 日经中文网有独立的打印页面,便于存档
中国政府网