[問題] 如何做到 文字垂直輸出

看板Web_Design作者 (koh)時間12年前 (2011/07/20 17:50), 編輯推噓3(3011)
留言14則, 7人參與, 最新討論串1/1
我要在網頁上一個div中顯示文字 像 這 樣 : 直 列 但是CSS只有IE可以做到,其他流覽器只會把整塊轉90度,字也會橫躺下來 1.有沒有辦法可以讓所有流覽器都用CSS做到? 如果用固定div寬度會讓中文字自動換行,但英數符號等卻會繼續往右邊長,不換行 2.有沒有辦法讓所有的字都強迫換行 先使用本來就橫躺的字型再轉90度,應該是使用類似"@細明體"這種以@開頭的字體 3.請問哪裡可以找到這種字體? 因為需要輸出的字大量且分散,不能使用做圖或太複雜的技巧 麻煩幫忙 謝謝 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 210.68.38.81

07/20 18:46, , 1F
我是用PHP把每個字切開來後輸出加上BR
07/20 18:46, 1F

07/20 19:00, , 2F
CSS3 與 Javascript 東亞文字直排 http://bit.ly/pWp6PV
07/20 19:00, 2F

07/20 19:58, , 3F
謝謝 但有可能使用不把每個字分開加工的方法嗎?
07/20 19:58, 3F

07/20 20:06, , 4F
<pre>
07/20 20:06, 4F

07/20 20:07, , 5F
1連用WORD都很難處理了,更何況網頁
07/20 20:07, 5F

07/20 20:14, , 6F
寫成是把文字翻轉可能比較快
07/20 20:14, 6F

07/20 20:14, , 7F
程式
07/20 20:14, 7F

07/20 20:37, , 8F
css好像有個word-break:break-all
07/20 20:37, 8F
break-all測試:IE,CHARME 正常 FF沒有作用 所以應該還是失敗

07/20 22:34, , 9F
謝謝 我再把每種建議試試看
07/20 22:34, 9F

07/21 02:10, , 10F
寫個AUTOHOTKEY 把文字斷一斷 再用<pre>...
07/21 02:10, 10F
※ 編輯: kohttp 來自: 210.68.38.81 (07/21 11:10)

07/21 11:18, , 11F
07/21 11:18, 11F
如我第一段所說,只有IE可以成功,其它流覽器會整塊轉,中文字也會橫倒 ※ 編輯: kohttp 來自: 210.68.38.81 (07/21 11:23)

07/21 11:29, , 12F
可是我剛測試是可以正常運作的
07/21 11:29, 12F

07/21 11:31, , 13F
阿 我知道你的意思了~ 那應該用jQuery自動切比較快吧
07/21 11:31, 13F

07/21 11:45, , 14F
請問jquery的自動切是哪個function?
07/21 11:45, 14F
目前測試成功的方式有點意外 1.設定div寬度 2.使用word-wrap:break-word; (超過寬度換行) 3.font:Monospace (讓全部字元同寬度) 這樣幾乎就都可以了,但是FF還是會讓二個半形並成一個全形,不會每個字都換行 4.font-size: (設定比div寬度大1px 這樣2個半形拼出的寬度大於div,於是FF會換行) 雖然照裡說中文字最右側會有1px壓到邊,但其實看不出來 以上四點合併在我使用的IE,FF,CHARME都正常顯示出所有中英符號 如果有人也測試這些卻發生問題請來討論 感謝回應的大大們 ※ 編輯: kohttp 來自: 210.68.38.81 (07/21 13:03)
文章代碼(AID): #1E9gK1kg (Web_Design)