我想要做的是類似於Photoshop/Illustrator/其他軟體中的文本框換行,你可以寫一個(gè)段落,但是如果“溢出”,它會(huì)跳到另一個(gè)文本框中,就像填充那個(gè)文本框一樣。
如果可能的話,我希望能夠在不使用JavaScript的情況下,只使用HTML/CSS來實(shí)現(xiàn)這個(gè)功能,或者至少知道這是不可能的,我應(yīng)該轉(zhuǎn)向其他方案。
我想要的視覺範(fàn)例:https://i.stack.imgur.com/Dzbhv.jpg
我嘗試了我見過的CSS文字換行的每個(gè)屬性,也進(jìn)行了Web爬取,但是我沒有看到任何類似於我想要的東西。
你可以設(shè)定顯示的單字?jǐn)?shù)量,以防止超出盒子(經(jīng)典的「閱讀更多」),但我懷疑你只能使用html/css來實(shí)現(xiàn)這一點(diǎn)。
當(dāng)然,我可能錯(cuò)了,但我沒有看到html或css可以根據(jù)特定條件進(jìn)行通信,剪切內(nèi)容並自動(dòng)跳到下一個(gè)div。
我在其他地方得到了一個(gè)非常接近的建議,我在這裡發(fā)布帖子,以幫助可能需要的其他人,似乎沒有一個(gè)自由浮動(dòng)的方法,然而,column-(x)
屬性似乎是最好的選擇。
在這裡可以找到一些文件:https://www.w3schools.com/css/css3_multiple_columns.asp
我實(shí)作的方式是給它一個(gè)自我描述的類別(在這種情況下是threeColumnDiv),每當(dāng)我需要時(shí)都會(huì)使用它。
另一個(gè)似乎可能理想的東西是grid-row屬性(參考:https://www.w3schools.com/cssref/pr_grid-row.php)。
如果還有其他需要的東西,似乎你將不得不以自訂的方式來做,但我覺得這些邊緣情況很少,不應(yīng)該是個(gè)大問題。
感謝大家在這個(gè)問題上的回應(yīng)和幫助!