3

iBooks 是否添加了诸如 CSS 类之类的东西或其他任何东西，以便在夜间模式处于活动状态时能够以不同的方式（以较浅的颜色）对书的某些部分进行样式设置？

4

3 回答 3

3

iBooks 为元素添加了一个__ibooks_internal_theme属性，该属性:root (html)的值随所选主题而变化。

继续这个：

:root[__ibooks_internal_theme*="Sepia"]    
:root[__ibooks_internal_theme*="Night"]

您可以在 GitHub 上找到更多详细信息：theme-detect.css

我最终将添加有关这三个主题的 CSS 限制的详细信息。

于 2014-11-23T17:19:25.410 回答
0

计算样式

你可以尝试做一个window.getComputedStyle(document.body).backgroundColor. 这未经测试。

编辑：关于 getComputedStyle，我的错误 - 背景颜色（假设这是 iBooks 使用的）不是继承的，所以 getComputedStyle 不会给你买任何东西。由于 HTML 元素上的样式具有不同级别的支持（HTML4 在技术上甚至不允许 HTML 元素 AFAIK 上的样式属性），理论上您的继承技巧可能不起作用。我会坚持一个

alert(document.documentElement.style.backgroundColor);

看看会出现什么。另一种蛮力方法是做一个

alert(document.documentElement.outerHTML);

您将在警报框中获得大量内容，但它应该会为您滚动，您可能会在其中看到有用的内容。

FWIW，Readium 显然在 html 元素上使用背景颜色为 rgb(20,20,20) 的夜间模式。

媒体查询

据悉，苹果引入了专有的媒体查询“分页”和“非分页”来检测用户是否在使用 iBooks 3.0 中的新滚动模式。它可能已经为黑暗主题（实际上称为“夜晚”）引入了媒体查询，但我只是猜测。无论如何，据我所知，没有办法枚举媒体查询，因此试图找到它将是一个纯粹的试错过程。

于 2013-01-18T11:41:48.867 回答
-1

没有 iBooks 的帮助，您可以为夜间模式添加另一个 css。只需在

<link rel="stylesheet" href="nightmode.css" class="night" />

另一种解决方案是将自定义媒体查询添加到您的 css 文件中：

/* Sepia */
@media sepia {
* { color: #000000; }
body { background-color: #eae4d3; }
}

/* Black */
@media black {
* { color: #ffffff; }
body { background-color: #000000; color: #ffffff; }
}

/* White */
@media white {
* { color: #000000; }
body { background-color: #ffffff; }
}
于 2013-01-16T02:33:35.943 回答