15

Kindle Fire Silk Browser Reading View の CSS クラスを正しく実装する方法を知っている人はいますか?

Kindle Fire 6.3 アップデートでは、「読書ビュー」が追加されました。

Silk の閲覧ビューを使用すると、関心のあるコンテンツが、閲覧に最適化された 1 つの画面ビュー (複数ページの記事であっても) で雑然とした場所よりも上に表示されます。ページ全体は引き続きバックグラウンドで利用できるため、従来のビューに簡単に切り替えて、ページ上の他の興味深い機能を表示できます.

自分のサイトの 1 つを確認する<div style="display:none;">と、閲覧ビューの記事としてレンダリングされましたが、閲覧ビューで表示する必要があるセクションにシルク ブラウザーを誘導する方法の詳細を見つけることができませんでした。

コードサンプル:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en" xml:lang="en">

<head>
  <title>Title</title>
</head>

<body>

<div id='content'>
  //important article here
</div>

<div id='sidebar'>
   //less important menu here
</div>

<div style='display:none;'>
   //lightbox HTML here, not important on mobile devices
</div>

</body>

</html>

ドキュメントが見つかったら更新します。

4

3 に答える 3

1

Kindle Fire Silkブラウザでこれを使用した経験はありませんが、iPhone には CSS ではなくセマンティック HTML に基づくリーダー機能があることは知っています。次のようなセマンティック レイアウトを使用する場合

<h1>header</h1>
<h2>some text</h2>
<p>a paragraph</p>

次に、リーダー機能がこれを適切に表示します。また、CSS スタイルが無効になっていることに注意することも重要です。代わりに、ビジュアル レイアウトは、読みやすさを向上させることを目的としたデバイスの標準です。オペレーティング システムでこれをハードコーディングせずに、このビューのスタイルに直接影響を与えることができるかどうかはわかりません。

于 2012-05-23T21:59:54.807 に答える
0

メディア クエリを使用してみてください。Kindle が Web サイトの印刷版のように見える可能性があるため、標準画面だけでなく印刷用のメディア クエリを作成すると、機能する可能性があります。

于 2012-11-03T06:46:20.313 に答える
0

手っ取り早い解決策は、javascriptまたはjQueryを使用して、読者が表示 (または読み上げ) してはならない要素を追加することです。

于 2012-10-25T22:17:46.227 に答える