优化网站以在Firefox中显示读者视图 [英] Optimize website to show reader view in Firefox
问题描述
但并不是所有的网站都会得到这个图标，只有在检测到可读的内容页面时才会出现。那我该如何为我的网站启用？
我试过媒体打印和一个额外的打印视图样式表，但是没有任何效果：
< html>
< head>
< style>
@media print {/ * no effect：* /
.no-print {display：none; }
}
< / style>
<！ - 无效：
< link rel =stylesheethref =print.cssmedia =print><！ - - >
< / head>< body>
< h1>一些标题< / h1>
< br>< br>< br>这是唯一的文字
< / body>< / html>
必须添加哪些程式码片段网站源代码，以便图书图标对我的网站的访问者可见？
添加< div> 或< p> 标签来实现一个页面来启动ReaderView。
我创建了一个简单的HTML：
< html><头>
< title>阅读器视图仅显示阅读器视图中的浏览器< / title>
< / head>
< body>
在读取器视图< br>中，主要div标签之外的所有内容都消失了。
< div>
< h1>在p标签之外的H1标签隐藏在阅读器视图< / h1>
< p>
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789 123456
将/ p为H.
< / div>
< / body>
< / html>
这是激活它所需的最小值。这是一个有点多方面的过程，为文本块添加分数。
例如，您可以激活论坛软件中的阅读器视图，如果添加< p> - 在view-posts模板的每个消息块周围添加标签。 $ b 这里是关于机制的更多细节
Firefox 38.0.5 added a "Reader View" to the address bar:
But not all sites get this icon, It only appears when readable content page is detected. So how do I enable this for my site?
I tried media print and an extra stylesheet for print-view, but that has no effect:
<html>
<head>
<style>
@media print { /* no effect: */
.no-print { display:none; }
}
</style>
<!-- no effect either:
<link rel="stylesheet" href="print.css" media="print"><!-- -->
</head><body>
<h1>Some Title</h1>
<img class="no-print" src="http://dummyimage.com/1024x100/000/ffffff&text=This+banner+should+vanish+in+print+view">
<br><br><br>This is the only text
</body></html>
What code snippets do I have to add into my website sourcecode so this book icon will become visible to the visitors of my site?
You have to add <div> or <p> tags to achieve a page to iniciate the ReaderView.
I created a simple html that works:
<html><head>
<title>Reader View shows only the browser in reader view</title>
</head>
<body>
Everything outside the main div tag vanishes in Reader View<br>
<img class="no-print" src="http://dummyimage.com/1024x100/000/ffffff&text=This+banner+should+vanish+in+print+view">
<div>
<h1>H1 tags outside ot a p tag are hidden in reader view</h1>
<img class="no-print" src="http://dummyimage.com/1024x100/000/ffffff&text=This+banner+is resized+in+print+view">
<p>
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
123456789 123456
</p>
</div>
</body>
</html>
This is the minimum needed to activate it. This is a somewhat multi-faceted process where scores are added for text chunks.
You can for example activate the reader view in forum's software if you add a <p>-tag around each message block in the view-posts template.
Here are some more details about the mechanism
这篇关于优化网站以在Firefox中显示读者视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
