Question

我正在尝试了解屏幕与打印行为。 APSW docs在打印与屏幕上看起来有什么不同？（在打印中，目录列消失，主列占据整个打印宽度）

（我正在尝试调试我没有这种行为的sphinx文档，但我想如果我能理解一个正常工作，我可以弄清楚为什么我没有。）

更新：仔细观察，仔细观察一下你们所回答的那些引用的basic.css中的“@media print”部分 - 我的basic.css之间有一条不同的行和APSW中的那个：

div.bodywrapper {
    margin: 0 !important;
    width: 100%;
}

我的basic.css中缺少!important修饰符，这导致margin: 0被覆盖。谢谢大家，我的问题解决了！

Answer 1

这是使用media types完成的。使用它们，您可以将样式规则限制为某个输出设备，如屏幕，打印机或手持设备。见这里：http://apsw.googlecode.com/svn/publish/_static/basic.css

Answer 2

这与media type相关联。

您可以将其链接到一组属性：

@media screen {
    body { font-size: 13px }
  }

或整个样式表

<link href="blah.css" media="all" rel="stylesheet" type="text/css" />

在你的情况下：

@media print {
    div.document,
    div.documentwrapper,
    div.bodywrapper {
        margin: 0 !important;
        width: 100%;
    }

    div.sphinxsidebar,
    div.related,
    div.footer,
    #top-link {
        display: none;
    }
}

Answer 3

他们有@media rules。

Answer 4

看看： http://apsw.googlecode.com/svn/publish/_static/basic.css

它们在样式表中包含另一个css文件 @import url（“basic.css”）;

html + css：屏幕与打印行为

4 个答案: