格友來信詢問：
我的部落格文章手機版看起來，排版都怪怪的。如上圖。
不知道如何改善？
這個一看就是按了enter「分行符號」的問題。
直接舉個例子說明：
電腦版的版面比較寬，假設一行可以有40個字
手機版的版面比較窄，假設一行可以有20個字。
例如，你一段中有120個字(中間沒有分行符號)，這在電腦版中就是3行，手機版中就是6行，到這邊都OK，正常。
但如果你一段有120個字，然後你自己按Enter(分行)，這樣在電腦版中看起來正常，但在手機版中就會出現格友問的這種問題，怎麼莫名奇妙自己換行了。
說穿了，這就是你自己在不該分段的地方按Enter造成的。
我問格友：你是不是先在word中寫，然後在COPY到部落格中來？你把你的word檔寄來我看看。
格友：是。
▲這是格友的Word，明明是同一段，但不知道為什麼卻有分段的標記。
所以當格友直接copy到部落格的編輯器時，會連同分段的標記一起copy過去，這在電腦版上看沒差，正常，跟在word看起來一樣，但在手機版因為版面窄的關係就會出現奇怪的「空白」。
這就是格友一開始問的問題，為什麼手機看文章，會出現奇怪的空白。
好，我特地寫這一篇文，我主要想說三點：
一、不需要在WORD中先打文章，直接在部落格編輯比較省事
因為你在WORD中打，無論你怎麼排版，到部落格中又亂掉，那還不如直接在部落格中打，還沒打完你就設定「隱藏」就好了。
另外在WORD中不要做任何的排版(字體顏色、大小這些都不要)，排版統一由部落格的CSS設定控制，這樣你日後要改版型時，才會能自動調整。
舉例，你在WORD中把文字設定成黑色+12級字，你貼到部落格就是黑色+12級字，而且永遠12級字，你改天換版本你要變成其他的級字，可以，你要一篇一篇修改，這樣會很累。
二、實體文章跟網文的分段是不同的概念
舉例，實體文章是每一段的前面要空二格表示分段，但在網文中是直接「空一行」表示分段，這個在CSS中的設定就是<P>的意思，而另一個<BR>是換行。
問：分段<P>，跟換行<BR>差別在哪裡？
答：一般分段在CSS中會設定直接空一行，而<BR>就是單純的換行，沒有空一行。請參考： 文章排版注意事項
三、文章排版必需考量在手機版中的觀感
以前沒有這種問題，但現在用手機瀏覽的用戶比用桌機的還多，以我的部落格來說，我花了那麼多的心思在版面設計上面，我還特地把所有的廣告都關掉，但你看看，手機54%，桌機47%。
也就是說，我自己平常也要用手機看看部落格，這樣才能知道大部份的用戶在我看我的部落格時是什麼感覺，然後再調整文章的排版。
好，以上說明給您參考。
格友詢問：
以面的說明我看了，但是我還是看不太出來要怎麼後調整。
請問後台可以直接去除word格式嗎？謝謝！
歐飛回覆：
現在只能一個一個「純手工」去除，並沒有一個指令可以讓你把所有的文章一次搞定，這也就是為何我說，你應該直接在部落格後台的編輯器寫文章即可。
而且寫完後，不光是電腦版，你連手機版也要看一下，這樣就算你遇到這種問題，因為一開始你就遇到了，你就可以當場調整，這樣下次你在寫文章的時候就會避免這樣的問題。
就不會發生現在這種事情，因為你已經寫了N篇文章了，現在如果要改，等於是要一篇文章一篇文章的純手工調整，這樣會很累，但也沒辦法，就是「花時間」調整一下，把「分行符號」去掉。
懶人包：部落格實戰全系列
_______________________________
留言列表
