讓一個p的鏈條流入「兩頁傳播」

最近有一位學生偶然發現了這個問題（或者說，不正確的xhtml/css的副作用）。這是可能的做一個跨瀏覽器，自動方式說一個WordPress的文章和自定義HTML/CSS？（也就是說，沒有PHP腳本等）。讓一個p的鏈條流入「兩頁傳播」

對於我來說，一直以來我的目標都是讓網站看起來像「一本書」而不是卷軸。

想法？

編輯：我應該明確目標。它是用f.ex寫一個帶有圖片的文本。 TinyMCE等，並將其與排版和佈局質量以及經典技術雜誌（如早期的BYTE傳播或科學作品集）的「可視性」結合在一起。如果沒有CSS技巧會自動處理溢出，我會接受一個php解決方案。我想擺脫的是需要手動將5頁的文章分成幾欄。

也許LyX可以生成體面的HTML與每2頁面傳播1個文件？這將是一個可接受的解決方案。

來源

2010-10-21 Henrik Erlandsson

如果這是你的意思，CSS 3允許流動「報紙專欄」。

http://www.w3.org/TR/css3-multicol/

~~目前大多數~~至少Gecko和基於Webkit的瀏覽器都支持它，但可能需要供應商特定的前綴：

http://www.css3.info/preview/multi-column-layout/

來源

2010-10-21 10:10:34 RoToRa

是的，酒吧狡猾的段落拆分PHP體操，這看起來是目前最好的。這篇文章的第一部分很好地涵蓋了我的思想來自：http://www.alistapart.com/articles/css3multicolumn – 2010-12-08 22:56:08

接受並感謝良好的鏈接:) – 2011-03-01 13:24:48

如果使用這樣的事情：

<p>text1</p> 
<p>text2</p> 
<p>text3</p> 
<p>text4</p>

，並給予以下樣式：

p { float: left; }

應該並排每個P側放置。但是，多少個P並排取決於有多少寬度可用，因此如果您定義每個P取200px，並且容器中的總寬度爲400px，則最終結果將是兩個P並排排列，是這樣的：

text1 text2 
text3 text4

請注意，這不會看起來那麼好（或工作這麼好），如果的普的內容不是長度大致相同。如果你需要尺寸自動分割成這樣的列，我認爲沒有一個簡單的方法來處理CSS。

作爲一個方面說明，我已經看到一些網站這樣做。 這不是一個好主意。它適用於紙張和雜誌，但根據我的經驗，屏幕不太好。除非我錯了，否則也有一些關於這個結論的研究。

來源

2010-10-21 07:31:25

謝謝。不過，如果你明白我的意思，那就是「處理溢出」。學生髮生的這個奇怪的錯誤可能與你描述的內容有關，因爲示例中的段落文本是三段'lorem ipsum'段落，然後它看起來是正確的，因爲它們的長度相同。關於不是一個好主意，我會將總體目標添加到OP中。 – 2010-10-21 09:33:49

正如賈尼說的，我不確定2列的佈局在網絡上效果很好，因爲人們通常在網上閱讀的方式。我個人不建議爲網站這樣的文章2列布局。

此外，我不確定無論如何你都可以創建，而不使用動態腳本，除非你指定每個部分的副本數量，否則用戶會錯過匹配的列很容易。

來源

2010-10-21 09:38:19

我接受你的觀點，即使我不訂閱'現有的標準方式成爲標準，所以人們已經習慣了，現在他們不能處理任何事情'，如果你明白我的意思。我認爲每個人都有能力閱讀兩頁傳播，多欄報紙文章，PDF文件等（更不用說他們已經一直這樣做，沒有考慮到這一點）。但是，如果高度固定，那肯定會有幫助。它是概覽/最大內容呈現與永遠滾動1000px寬文本之間的選擇......寬屏顯示器更適合前者。 – 2010-12-08 22:46:44

是的，但我認爲將打印邏輯應用於網絡存在根本上的缺陷，因爲它是一種完全不同的媒介，人們閱讀網頁並與網頁互動的方式與某種打印方式的互動方式並不相同。另一件需要注意的事情是做出一個假設，總有人會在一個神話般的高分辨率屏幕上看它，因爲事實並非如此。他們可能會在上網本，平板電腦甚至是智能手機上看它，但不能保證。這並不是說我們不能從印刷術中學到一些東西，但是你需要小心你如何應用它。 – 2010-12-14 12:34:50

我接受你的意見，但我認爲如果我遵循它，如果我將內容調整到最小（最小）公分母，我會捕獲相同數量的flak。如果手機要求用作衝浪板的優點，它應該適應網上找到的頁面，而頁面應該根據其呈現的內容進行佈局。當然，我的佈局比我的內容更好，比標準的沒有結構的博客或網頁已經有3列，其中兩個填充了不相關的垃圾。 – 2011-03-01 13:22:11

讓一個p的鏈條流入「兩頁傳播」

回答

相關問題