如果你有注意到本站的文章段落、文字大小及行距都經過調整,
會讓你閱讀起來毫不吃力、讓你感到很舒服,那筆者會感到非常
開心。也希望能推廣這種寫作方式。
最近看了很多家部落格,其中不乏一些超熱門網誌,很多站台的
文章文筆都非常好-可是閱讀起來卻是非常吃力。非得把文字放
大又放大才能看清楚作者在寫些什麼。或是行距過小,所有字都
擠在一塊,看起來簡直像是在考驗視力了。
在這邊我建議部落格寫手們不仿抽空閱讀一下部落格前輩-老貓
的寫作建議(連結)。裡面即有提到字級和行距的重要性。
然而有些寫手或許知道這個問題,但卻不知道如何去修改,打開
文字編輯器,也發現僅能就文字大小做調整,無法調整行距。那
怎麼辦呢?
在這邊即以痞客幫為例,教導大家如何從CSS下手,去改變您部
落格的文章行距、以及預設字級,讓大家都能寫出漂亮編排的文
章來。
首先,進入部落格管理後台,左邊欄位選擇「樣式設計精靈」,
右邊選擇「CSS原始碼編輯」,你會看到圖片如下:
----------------------------
接著按下ctrl+f,找尋".article-content"或是"文章內容",接著
你會看到像是這樣的設定:
/*--文章內容--*/
.article-content{
font-size:12pt;
line-height: 180% ;
margin : 5px 0px ;
padding: 0px 0px 0px 0px;
}
請注意,這邊的font-size即是改變文字大小,line-height就是改變
行距。筆者在這邊誠摯建議,文字大小設定至少10pt以上,line-height
設定至少160%以上。(160%代表行距為文字大小*160%)。
改變之後,按下下面的預覽,看看是否讓您滿意,滿意的話,就可以
按下儲存了!如此一來,你的部落格從此將更令人賞心悅目了!
歡迎大家繼續將這個方法推廣出去唷!
當然對本站文字編排、字級、行距有任何建議的,也歡迎大家給予筆者
建議唷!希冀能給讀者們最舒適的閱讀空間!

行距我推薦的單位是 em,基本上這也會隨著font-size做調整,1.5em代表word裡面的1.5倍行高,2em的話就是2倍行高
恩 兩種效果都會一樣的~希望能把這種舒服行距(至少1.5倍以上行高)推廣出去~ 感謝夜靈的建議~
正在為此煩惱 感謝分享!
不會,希望能予以推廣^^
怎麼把"放文章圖片的那個欄位"版面 調整大小???
不太了解你意思@@.. 若是單純要調整上傳圖片大小,則上傳完後用滑鼠去拉(指到圖片右下角)即可。 如果是要調整內建樣式的圖片大小,需要去改css碼,歡迎跟我說你想改那張圖,我會研究出來怎麼改然後寫出來。:)
用em與%二意思相同, 梅干個人也是比較習慣用em, 這看個人習慣~ 二種都可以~ 一般梅干也都設1.6倍比較多~ 間距會設1px 看起來感覺比較舒服~ 另外字的大小,則是設15級~ 現在螢幕解析度都很好~ 設12px,實在看了有點難過~
*****
我也正有此困擾..看到這篇.受益良多..
哇~我就是在找行距問題 不知道是該從那個標籤設定 謝謝分享
/*--文章內容--*/ .article-content{ margin: 20px 0px 20px 0px; line-height: 18px; font-family:Verdana; 現在為此挺煩惱的... 上面是我的模式 請教你我該如何修改呢?? 感謝了!!
妳要改行距嗎? 把 line-height: 18px; 改成 line-height: 180% ; 看看
*****
*****
*****
*****
*****
*****
*****
*****
這問題困擾我好久了 感謝您的分享 但我的css設定裡 找不到"文章內容" 只有很多".article-content" 所以就把所有的"font-size"和"line-height"都改了 但好像怪怪的 請問要怎麼恢復原先的設定呢?
你是套用別人設計好的樣式嗎?是的話重新套用一次吧~ 不是的話,就比較難改回來了... 建議沒信心的話..每次修改都要備份一下呀
總算用好了 再請問...右手邊那排側邊欄位 可以改成全部靠左邊嗎? 語法要怎麼改呢 還有 您這篇文章可以借我引用嗎? 我想一定有很多人都有這類字型行距設定的困擾
第一個問題..可以..要改成只有一排欄位 第二個問題..有附來源的話,歡迎引用唷:)
謝謝您的分享,讓我受益良多!:D
非常實用的技巧....感恩囉,謝謝分享
太棒了,希望有更多的技巧喔
我早晚會幫這個部落格研究獨特版面,到時候在來發表CSS心得吧:>
為什麼你的header沒有"跳到主文"和"部落格分類",我也想跟你的編排一樣耶,但我在css裡找不到.skiplink和#blog-category,謝謝你~
*****
謝謝分享.
感謝來閱讀 ^^
版主懂這麼多,真的很厲害欸.
不會啦:$
讓我的文章不再黏惕惕,3Q
非常感謝,幫了我很大的忙呢XD
目前CSS如下: .article-content { _height:1%; overflow:hidden; _overflow:none; line-height:2; color:#666; } 請問行距也是改成180%嗎? 另外字型大小自行加入font-size:18pt 不過文章內容好像沒改變??
*****
請問~ 目前CSS如下: .article-content{ _height: 1% ; overflow: hidden ; _overflow: none;} .article-content p{margin-bottom: 1em;} 請問該如何調整才好? 另外您的版面蠻清新的 我可以套用再換成我自己的圖案跟顏色嗎? 不知道該如何進行呢?謝謝^^
謝謝你~正好苦惱要怎麼調行距^^
*****
請問我可以使用這篇文章裡的那張鋼筆圖片嗎?
歡迎使用
謝謝您的無私分享,這資訊非常有用^^b
讚!!!! 這樣看起來很清晰~~
*****
請問一下我照這樣子改了行距之後不知道為什麼只有第一篇文章行距沒改到 其他文章都有改道@@ 請問是我漏了什麼沒改嗎?^^"
好文~~實用推推 回家來改改看~~
您好,我想請問 如何可以改變留言板文字的行距? 謝謝您
謝謝分享,很實用。