CSS和打印：保持塊文字一起

這是一個典型的多選考試，假設一個問題的格式：CSS和打印：保持塊文字一起

<question qid='1'> 
<stem>What is your name?</stem> 
<choice value = 'a'>Arthur, King of the Britons</choice> 
<choice value = 'b'>There are some who call me ... Tim!</choice> 
<choice value = 'c'>He is brave Sir Robin, brave Sir Robin, who-- Shut up! Um, n-- n-- n-- nobody, really. I'm j-- j-- j-- ju-- just, um-- just passing through.</choice> 
<choice value = 'd'>Sir Galahad... the Chaste.</choice> 
<choice value = 'e'>Zoot... Just Zoot.</choice> 
</question>

，我已經得到了這一切映射到相應的風格指數與網絡單選按鈕。

現在，我需要測試的可打印版本。這實際上更簡單，因爲我不需要包含收音機，只需'___'作爲複選標記。主要問題是如何避免分頁問題發生。

來源

2010-01-12 Chris Cudmore

編輯的回滾。「寡婦」是正確的標籤。「Windows」不是。 – 2013-02-06 19:59:31

這不需要新的標籤。 – Charles 2013-02-07 03:49:21

這可能是對的。但編輯錯了。 – 2013-02-07 15:48:25

我從來沒有運氣一貫地防止這樣的事情。它可能有點骯髒，但如果問題通常是相同的長度，你可以在每個X問題後強制分頁？

<style type="text/css"> 
.pageBreak{ 
    page-break-before: always; 
} 
</style> 

<question>...</question><br class="pageBreak" /> 
<question>...</question>

（或者說類適用於任何你想要的問題或）

您可以嘗試使用分頁，裏面的屬性，但我還沒有看到它是因爲它的瀏覽器支持一致是一個爛攤子，現在：

question { 
    page-break-inside:avoid; 
}

來源

2010-01-12 19:45:22 Parrots

看起來像分頁，裏面只在Opera的支持，這使得它只是爲「真實的世界」（TM）沒用我想到了另一種選擇，而是源於一個襯墊到整個段落不同，所以尺寸沒有一致性。 – 2010-01-12 19:57:14

在IE8中工作，儘管目前w3schools網站稱IE不支持。我猜舊版本不會。我目前擁有的Firefox 3版本，沒有。我也有類似的要求，但是在一份將要出版的報告中，決定嘗試採用PDF生成方式，希望XSL-FO能夠正常工作。 – jamiebarrow 2011-01-07 10:07:29

'page-break-inside：avoid'在Chrome 22中適用於我（Firefox 15中沒有任何內容）。 – bdukes 2012-10-24 03:08:29

我建議你在CSS中查看page-break-after,page-break-inside和page-break-before規則。

來源

2010-01-12 19:41:37 Sampson

使用單獨的打印樣式表，並使用page-break-before和page-break-after選擇您的前導和結束的問題在每一頁上。

如果測驗是靜態的，你可以畫出你使用了類，使其沒有什麼比CSS更多的工作。

來源

2010-01-12 19:57:30 tahdhaze09

測驗是隨機的，從池中選擇。因此無法知道頁面的第一個和最後一個問題。 – 2010-01-12 19:59:48

您需要使用JS解析直到找到問題相對於您想要「頁面」的大小的位置。 – tahdhaze09 2010-01-12 21:01:41

使用表格佈局。但爲了避免更改語義，請使用CSS。

question { 
    display: inline-table; 
}

來源

2012-12-06 20:08:03

CSS和打印：保持塊文字一起

回答

相關問題