我正在嘗試在全頁 div 容器後進行分頁。 就像載入一個介紹頁面一樣，如果向下捲動，您可以進入一種導航中心。 我覺得這可能是 chrome 問題，但分頁符號項目在 Edge 中也不起作用。
我想要在 <div class="pagebreak"> 的關閉標籤之後分頁。 div 包含一個背景、一個小標題和一個大標題，所有這些都填充（並且應該填充）一個完整的頁面。之後，我想強制打開一個新頁面，這樣您就必須向下滾動，而與螢幕尺寸無關。
<body>
<div>
<div class="pagebreak">
<div class="nav">
<nav>
<div class="navitem">
<a href="#webprogrammierung">Webprogrammierung</a>
<a class="name">Niclas Kusenbach</a>
<a href="#verteilteSysteme">Verteilte Systeme</a>
</div>
</nav>
</div>
<div class="container">
<div class="centered">
<h1>Mein Portfolio.</h1>
<h2>Entwicklung verteilter Systeme</h2>
</div>
</div>
</div>
<div class="uebersicht">
<div id="webprogrammierung">
<h3>Webprogrammierung</h3>
<a>Vorlesung 1</a>
<a>Vorlesung 2</a>
<a>Vorlesung 3</a>
<a>Vorlesung 4</a>
<a>Vorlesung 5</a>
<a>Vorlesung 6</a>
<a>Vorlesung 7</a>
</div>
<div id="verteilteSysteme">
<h3>Verteilte Systeme</h3>
</div>
</div>
</div>
</body>
.uebersicht {
display: block;
page-break-before: always;
float: none;
}
.pagebreak {
page-break-after: always;
page-break-inside: avoid;
}
P粉3114235942024-04-03 09:09:59
我希望我理解正確，這個例子會對你有幫助
試試這個CSS
html, body {
width: 100%;
height: 100%;
margin: 0;
}
.wrapper {
width: 100%;
height: 100%;
margin: 0;
display: flex;
flex-direction: column;
}
.first {
width: 100%;
background-color: red;
flex: 0 0 100%;
}
.second {
width: 100%;
background-color: blue;
flex: 0 0 100%;
}
並嘗試這個 html
Some picturessome content