css - 强制脚注与其文本引用位于同一页上

在CSS中，我试图弄清楚是否有代码使脚注始终（或至少开始）与其正文中的相应编号位于同一页上。我目前正在使用一个程序（Pressbooks），有时脚注会在正文中跟随其编号显示在页面上。当脚注编号位于正文的最后四行中的任何位置时，就会发生这种情况。您可能建议修正任何编码吗？

这是相关的编码：

@page {
  @footnotes {
    border-top-style:solid;
    border-top-width:thin;
    border-top-color:black;
    margin-bottom: 20px;
    margin-top: 20px;
    padding-top: 0.5em; } }

.footnote {
  font-size: 0.75em;
  display: footnote;
  display: prince-footnote;
  position: footnote;
  counter-increment: footnote;
  footnote-style-position: inside;
  margin: 0 0 5px 5px;
  padding-left: 0px;
  text-indent: -10px;
  line-height: 1.4;
  text-align: left; }

.footnote {
  font-size: 0.875em;
  display: footnote;
  display: prince-footnote;
  prince-footnote-policy: keep-with-line;
  position: footnote;
  counter-increment: footnote;
  footnote-style-position: inside;
  margin-left: 0px;
  line-height: 1.4;
  text-indent: 0em;
  text-align: justify; }

最佳答案

如this comprehensive article about print design with css（paragraph about footnotes）中所述，您可以使用此CSS将脚注移到所引用页面的脚注区域：

.footnote {
  float: footnote;
}

这是使用CSS正确定义脚注的方式，但是程序（浏览器或打印前制作应用程序）可能总是会误解它。

关于css - 强制脚注与其文本引用位于同一页上，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36981056/