這次是改變內文和側欄的寬度,這也是很多人問過的問題!:)
首先呢,要先知道寬度的英文叫做「width」。
若我要設定某區塊為100px,就這樣打:width: 100px; 。
以最常問的內文來說,就是 #content{width: 100px; }(當然不可能只設為100px啦…XD)
側欄呢,就是 #links{width: 100px; }。
在改寬度有個重點要注意,就是…其實我不知道怎麼說… = ="
意思就是,例如今天要改內文和側欄的寬度的話,兩者的寬度加起來不能超過 #container 的寬度。
因為 #content 和 #links 都是包含在 #container 下面的,
所以如果 #content 和 #links 的寬度超過 #container 的寬度,#container 會包不住這兩樣,就會造成側欄往下掉的悲劇(?)。
*注意:如果 #content 和 #links 有使用 margin-left 或 margin-right 的話,也要把 margin 的數值算進去,不然也會跑版。
再來說說三欄式要注意的,
三欄式的側欄會多兩個設定:#links、#links-row-1(三欄式第一欄)、#links-row-2(三欄式第二欄)。
所以改的時候也要注意 #links-row-1 和 #links-row-2 的寬度加起來不可以超過 #links 的寬度噢。(也要記得把margin的值算進去)
補充:由於做樣式的慣性,在改的時候或許會遇到一個問題:底圖不變,看起來很奇怪。
因為做樣式時常常會需要製圖美化每個區塊,而背景就是基本上一定會另外做的,所以看到的背景並不是用色碼指定區塊(側欄或是內文)的背景色,而是圖片。既然是圖片,想當然爾光改CSS是不能變動它的囉。
要改的話只能再做一張新的圖,把原本的圖取代掉。
- 5月 11 週日 200811:54
教學|調整內文和側欄寬度
文章標籤
全站熱搜

^^用心的好小孩... 真棒!!
可是打這個好累噢..Orz 不過這樣以後就不用一個一個教了~XD 說到底也是因為懶啦..(汗)
我我我...看不太懂 囧
呵呵~不懂沒關係啦!! 反正小寶沒有要改嘛~ XD
hi~ 我覺得你很厲害喔~ 我也想學css 可以像你們這樣設計樣式,超酷的 可以建議我該從哪裡學起呢?? 感恩 ^^"
咦咦咦!!! 我現在才發現這篇迴響 = A =" 真是不好意思 > x <" -- 剛剛點了你的blog 發現是我的樣式耶!! >///< 是你改的嗎? 改得很好看耶 =ˇ=((那個閃閃背景good! ((不過有點跑版..超級一點點的一點點~ 那你應該也會一點了吧 ˙ˇ˙? 有問題需要我幫忙再問我 ^ ^ P.S.你錢錢好可愛~~~XDD
對呀,是你的樣式呦 我超愛的~謝謝你做出這麼漂亮的樣式 我因為想用這個樣式 所以才從無名搬家來痞客的啦 我想放上我們家狗狗的照片 再個人化一點點所以就一點點一點點慢慢的改成這樣了 花超多時間的 你不介意真好^^" 星星的背景是希望格子裡的風格是像樂園一樣的閃亮 錢錢狗寶貝住的地方充滿歡樂 我還很菜 跑版是什麼意思呢?? ㄎㄎㄎ...
唔!!! (驚!!) 為了要用我的樣式才跑來痞客嗎?!˙口˙" 好感動噢~~~~>////< 真是太謝謝你了~(抱) -- 只要是自己要用的 隨便怎麼改都可以啦~ = ˇ = 這樣也可以練習練習怎麼弄CSS XD -- 你們家真的有歡樂的fu唷~ 錢錢真幸福 XD 話說我有一個朋友的狗狗也叫錢錢耶!! ˙w˙ -- 跑版就是.. 東西跑掉了!!(?) XD
原來東西跑掉了>"< 我都不知道 因為我家電腦上網是用用kkman跟IE 我打開來看都好好的,就以為好了,沒想到都跑掉了 >"< 可以告訴我你用什麼看,然後跑掉了嗎?
噗噗..不用緊張啦 XDD 也不算跑掉.. 只是下面有捲軸而已 = w ="((被打 無傷大雅的啦 XD
嗨,你好… 我很喜歡你的樣板耶,都好漂亮喔! 我已套用了你的樣板0012-2,再此謝謝你囉!^ ^ 因為也想調整側欄和內文的寬度,可是我看了這篇還是有點不懂耶… 我有找到#content , width=690px,#links, width=272,也有找到margin-left 或 margin-right,可是沒有看到後兩者的寬度,我可以偷懶不去管後兩者是否有寬度,只要將#content和#links的寬度加起來的總和是原來的總合就可以了嗎?也就是原來是690+272=962,我可以直接將內文寬改成710,側欄改成252嗎,因為這樣加起來還是962? 另外想請問我已更改過header的照片,要如何才能保有和你原先的圖片一樣有左邊的那層像薄紗一樣的感覺呀? 更改欄寬會影響這層薄紗的顯現嗎?是否要先更改欄寬後再增加圖片上的薄紗才行呢? 另外我有看到之前你回網友時提到murmur要在後台輸入想說的悄悄話,能否請問後台是指哪兒呀?是CSS語法裡嗎?要到後台哪裡更改?不好意思我不會CSS,所以問了很多問題,麻煩你了,謝謝!
margin後的*px就是啦,這部分可以參考下一篇教學"調整邊界" :) 如果不想管margin的話,那最好就是將它設為0px或是刪掉,就不會影響了。 摁,一般來說你的想法(要將內文改為710而側欄改為252)是可行的。 但是這樣式(或者應該說很多樣式)不是以很普通的做法作的,你可以到CSS裡找到#container,裡面有一串設定背景的語法,就會發現背景是用圖片做的,而不是一般的色塊。所以,若是依照你的想法這樣改,版子雖然不會跑掉,但是因為背景圖的關係,看起來會怪怪的,讓人以為有跑版。 (也就是你問的“更改欄寬會影響薄紗的顯現嗎”,你可以先照著你所想的改改看,就知道我的意思了) header的圖也是我做的,所以你說的那個薄紗,是沒辦法直接保有的,要改的話必須自己用繪圖軟體或影像處理軟體做噢! 改murmur不用改CSS,到後台/好友互動(可以選部落格或是相簿的那排), 點左邊選單的[我的碎碎念]就會有一個新視窗跳出來,然後點[使用pixnet帳號登入],就會進到自己的碎碎念版面了。 不用客氣,有問題可以再問我:D
*****
*****
*****
*****
疑疑疑疑疑!?? 我用的是firefox的,才剛更新過(Orz) 好吧,如果別人看了沒問題就這樣吧? haha 我的文章常常不知不覺就漏漏長(///搔頭),可怕的碎念啊!!!!
您好, 謝謝您的教學, 我剛在摸索部落格,真的很新手, 您的教學對我來說,已經很白話文了.... 感謝..... 可是我不知道這些語法要在哪修改耶??? 我是套用既有模式, 但覺得側欄寬度太寬, 但在在"自訂樣式進階版"中的"側欄 (#links)"設定選項只看到 背景顏色,文字顏色的修改,沒看到可以更改側欄寬度...... 問客服的回答是 "目前需透過調整部落格樣式的CSS語法來進行修改。......請您不吝親自於網路上搜尋符合您需求的相關資訊....." 還好我一查就是您熱心解說的文章, 不好意思,問這麼基本的問題.... 謝謝。 ^ ^
妳好, 我找到"編輯 CSS 原始碼"處了, 我想將側欄調窄, 將 #links { float:left; width:290px; } 改為 #links { float:left; width:190px; } 也儲存了.... 部落格頁面卻沒更動 側欄寬度, 是我遺漏了什麼步驟嗎?? 然後, 側欄調窄,就想將主文欄 調寬, 卻沒找到#content{width: 有可能有其他 英文嗎?? 謝謝,非常感謝您的分享與教學...^ ^
我到妳的網誌看了,有喔,到CSS原始碼那邊再找找#content裡的width(可以用「ctrl+F」輸入「#content」找),現在的設定值是635px。 若要把#links改為190px,可以把#content改為735px,改好後按右下角的儲存按鈕。 另外有一點,改好後背景不會變唷。嗯,就是,妳現在的藍底和白底處的寬度是不會變的(或許是因為這樣所以妳看起來像改了數值卻沒更動),因為背景圖是製作者在做的時候就做好了,除非再做一張新的圖或是把現在的圖撤掉,不然是不會變的。(這樣講可能有點模糊,先將側欄和主文寬度改好就知道我的意思了) 試試看吧,有問題可以再問我。:)
謝謝您的回覆, 您回覆得好仔細, 謝謝您..... 真的耶~~~ "是藍底和白底處的寬度是不會變的(或許是因為這樣所以妳看起來像改了數值卻沒更動)" ......您完全說對了 Orz............... 那就算了,目前沒有時間研究 換底圖,就先這樣子囉~~~~ 謝謝您的熱心, 那真的還可以問一個笨問題嗎?? 行高(行距)要怎麼調整?? 客服也是叫我自己查CSS碼.... 我還沒爬文查,可以直接請教您嗎?? 非常非常感謝您 ^ ^
嗯,其實如果你會一點製圖的話,換底圖挺簡單的,於CSS是只要換個網址的事。 行距的話,找CSS裡的.article-content{line-height: *px; } 改*數值就可以了,數字越大距離越大(如果沒有line-height可以自己加進去)。 不客氣:)
謝謝,謝謝, 我找到了,也試修改了,可以預覽已經成功了, 但是我還沒正式改, 因為解決了行高設定,要大改編排,要晚上才有時間弄了 謝謝,謝謝,妳真的很厲害又有耐心.... ㄟ....可以再請問一個問題嗎?? 要如何使 側欄中, "文章分類" 處於展開狀態.... 讓何人來瀏覽,都是展開狀態, 就是可見"資料夾"內的分類內容.... 我問客服的回答, "站方已收到您的提問,於文章分類與資料夾的部份,目前站方預設皆為收起的狀態,暫未有提供會員自行設定為全部展開的功能,還請您的見諒。" 這次連叫我去查CSS都沒有, 所以是連CSS 那都不能改嗎?? 謝謝,感謝您這麼熱心的幫忙, 真的幫了我超大超大的忙.... 未來我寫"成立部落格的歷程"文, 可以把妳供出來嗎?? 謝謝。 大感恩。
嗯,是的喔,這方面就是要跟站方建議可以修改的了。 噗哧,可以啊。舉手之勞,不用如此客氣,而且也是因為妳態度超好,讓人忍不住想幫忙。:)
謝謝您的回覆 ^ ^ 所以只能希望 站方趕快修改成有這個 功能了..... 希望不會遙遙無期 ^ ^ 謝謝您,是您對每個提問的人,都很有耐心 細心....又很厲害 謝謝您的幫忙 ^ ^ 阿~~可以再請問一下,(拍謝 一堆問題...) 請問,我本來想設FB同步發表文章, 不過痞客邦要我同意的 授權,讓我有點害怕 1.以我的名義貼文?? 2.「痞客邦 PIXNET 」可以存取你的資料,即使你並沒有在使用這個應用程式。??? 因為我不同意,所以一直沒能同步成功 @ @ 所以先聽聽前輩的經驗及意見, 同意這二個授權 沒關係 沒有後遺症嗎?? 謝謝喔~~ ^ ^ 一直麻煩您
那不是痞客邦要你同意,是FB要你同意,如果你常用FB就知道每要用某個東西就會跑出這種授權的讓妳同意。 以名義貼文就是,例如:你發了一篇文章,有選擇同步的話,FB就會有你大頭發出的痞客邦新發文訊息,如果要同步,這是必須的。 存取資料我就比較不清楚,如果你信任痞客邦(或FB)可以同意,不然應該可以把它打叉吧(滑鼠移到該項上面,右上角)。
*****
*****
謝謝妳的回覆, 之前就是"把它打叉", 就一直沒能同步成功>"< 我會再試試看的...... 再次 大大大感謝妳 ^ ^
不客氣:D
*****
*****
您好~剛剛去改了~ 但是搞不定~ 現在版面亂掉~ 修改不回了來! 糟糕~XD 可以幫我看一下問題在那邊嗎? 感激不盡了~ http://jeiphoto.pixnet.net/blog
嗯,你應該已經改好了吧?(這麼久了) 有問題可以再問我,有空會回:)
*****
謝謝囉~
不客氣:)
你好 我目前用的是這個樣式 http://panel.pixnet.cc/theme/blog/5669 他很漂亮帶我覺得內文的地方太窄了 請問要怎麼改成寬板呢? 我希望白色的部分少一點 中間紅綠藍整個放大變寬 可以給我一些建議嗎? 或是要去哪裡爬文改CSS 謝謝你
先找找看CSS裡的#body-div或是#container裡面有沒有width,那個數值是整個樣式的最大寬度。看你需要多寬就把數值改多寬。例如螢幕1024*768的建議改成1000px。 然後照我這篇文章的找到內文(#content)和側欄(#link-row-1、#link-row-2)的寬度,大概調一下看你要多寬就改width的數值,不能超過上面#body-div或是#container的寬度。 如果改好之後側欄往下掉的話就表示內文和側欄的寬度加總起來超過全樣式寬度,再稍微調一下數值就可以了。 - 噢對了,如果改好之後發現文字範圍變了,但底圖(紅綠藍色部分)卻還是一模一樣的話,那就表示作者在做樣式時把背景弄成圖片了,這樣是無法更改的(表示紅藍綠不是顏色而是圖片)。
*****
*****
*****
*****
*****
*****
*****
*****
*****
*****
好正啊!我找了很久啊!終於找到你的文章!真的是謝謝你!
不用客氣,很高興有幫到你哦~
您好,我還是看不懂怎麼用,可以請您直接跟我說我如何改成寬版嗎?謝謝您
@ @? 麻煩請再問具體一點。 改成寬版的意思是?要充滿整個螢幕嗎?
*****
*****
*****
哇~ 謝謝分享~
可怕啊!原居士林長:李木源《地獄懺悔文》 《發露懺悔文》 李木源居士 未學李木源發露懺悔文: 尊敬的上凈下空老法師,末學李木源跪叩師父。我墮落到地獄受刑有三年了,因為自己肯在地獄中懺悔罪業,生前又為眾生做了大功德,才准許向同修們託夢,求他們想辦法幫我修積功德,出離地獄苦海。 感恩一位有緣居士與我溝通,經他執筆寫成材料,現將我發露懺悔文公佈於眾,懇請凈空恩師原諒我的罪。 我生前是以凡夫心,衡量您老人家的佛心,以凡夫的小人心,嫉妒您的佛心,我是自私的名利心,我對不起您慈悲救度眾生的心,我障礙了您講華嚴經,使無量眾生沒有聽完,不能得度成佛,修行最終誤入了歧途,我障了師父您,障了無量眾生成佛 ,也障了十方虛空法界,我對不起十方諸佛,我的罪無量無邊,我的罪塞滿了虛空法界, 真心叩清這些眾生給我改過自新的機會,希望你們能夠原諒我,等我成佛後一定要報恩,度我所障礙的這些眾生。 希望所有誹謗障礙過凈空老法師的人,都以我為戒,趕快真心懺悔所造的罪業,末學李木源奉勸世間人,千萬不要造業,等到了地獄受報,就知道什麼業都不可以造。 也盡量不要和任何眾生結惡緣,結了惡緣就會冤冤相報,宿世難轉,不要以為我們是修行人,造了小業沒什麼影響,實際上都要因果相隨,今世造業不但今世受報,還會障到來生修行。 我造的重罪就起因於前世結下的因,多世前凈空老法師和我是兩個寺院的大和尚,在參華嚴經經文的時候意見不統一,我生的嗔恨心。 儘管今生我在佛門修積了大功德,但仍然不是真修行,道心不具,還是起了嫉妒惡念,障礙了老法師講這一部經,我在地獄受刑的確是罪有應得。 佛門的同修們不要以為沒有地獄,是真有地獄,四十由旬高的鐵圍牆,上下竄火。 我因造罪深重,活著時神識就斷斷續續地下地獄了,但肉身並不知道,現出病苦相,渾身疼痛,等肉身死了七天之後,就明白了,全都知道了,自己生前所造的罪因,在地獄受刑。才知道是功不能抵過,功是功過是過不能相抵。 到一殿判官拿來我的一尺高的善薄三沓,還有半尺寬一尺長的惡薄,我以為自己善薄多,沒想到判官把我押到天平前,用天平稱一稱,只見惡薄在天平上一下沉到底。 我知道自己造業是因為自己心念不好,必下穿心地獄,我在穿心地獄受了三個月的罪報,剛進穿心地獄,我就嚇得渾身癱軟,腳像被焊到地上一樣,想拔拔不動,我趕快喊的三聲凈空老法師我知錯了,沒等喊完,兩名獄卒,綁住我的雙手,另有兩名尖嘴利牙的鬼卒,抬著一桿大鐵槍,刺透我的心臟,我一下就疼死過去了,業風一吹立即又醒過來,鬼卒繼續用鐵槍把我的心臟扎穿,一邊扎一邊問,我讓你再心壞,看你心還壞不壞了? 地獄的刑罰苦不是我們能想像的,受罪時我念頭裡只有撕心裂肺的疼痛,根本沒有念佛機會。 受了三個月罪後,我就一直在開胸地獄受報,我的五臟被鬼卒用三尺長的利爪,一齊撇在地上喂狗,我馬上昏死過去,業風吹來受傷的身體又復原了,五藏又被不斷的掏出來喂狗,狗吃完還長上。 如果不出離地獄,再過一個月,我又到油鍋地獄受刑了,我看到鬼卒把罪人扔到油鍋里炸,炸完用鐵網撈出來撇在地上,然後夜叉拿著三個尖的鐵叉挑起罪人,再次扔進油鍋里炸,在地獄裡我看到了地藏王菩薩,我拚命喊老人家救命啊,因為業感我到不了菩薩的身邊,必須不停地受刑。 我在地獄受報才真正明白了,師父他老人家講的地獄門前僧道多這個道理,我看到過世念佛人中,有十分之三的出家人,十分之二的在家居士在地獄裡受刑,其中十分之三的出家人,和十分之一的在家居士要先到鬼道補經室,補生前錯念漏念的經文。補經室內陰冷潮濕,光線昏暗,油缸上捻著像針一樣細的燈芯,光亮像螢火蟲一般亮,一會兒明一會兒滅。罪人坐在石凳上補經,很難看清經本,等補完經後才允許去各殿論罪。 受過刑罰的出家人和在家居士,要按罪業輕重分別轉生,地獄裡的鬼頭,鬼頭中就有十分之三是墮落地獄出家人,受完罪報後轉身的,還有十分之一是墮落地獄的在家居士,受完罪報後轉身的。我在地獄受刑三年,看到了墮落的修行人生中,只有四人受完罪報後,轉生到天道和城隍土地,其餘全部轉生到餓鬼和畜牲道。 看到這麼多同修,看見這麼多同學像我生前一樣勇猛精進的搞形式修行,往生後先到地獄受報,最後全部轉身惡道。真讓我感到無比心疼和羞愧,我們修行一生,沒出六道,真是冤枉,白白耗費了光陰,對不起佛菩薩,祖師大德慈悲教侮,我們是真正的罪人。 我看到墮落地獄,受罪的眾生中,有70%是犯了淫慾罪。修行人墮落到地獄,大多數也是因為犯了意業淫慾罪,雖是修行人,境界現前時,內心剎那也會起各種微細的惡念,以為自己沒有犯身業罪,卻不知犯了嚴重的意業罪,修行人犯罪不論意業身業,都是知錯犯錯,罪加一等,罪在沒有表好法,這樣會障礙很多眾生學佛成佛,所以果報都要加倍到地獄受罪。一個意業就這麼重。 我看到修行人墮落地獄,主要因為犯了以下三類罪業。 第一類 意業淫慾罪 這類墮落地獄的修行罪人,佔在所有墮落地獄修行罪人的十分之七。墮落男眾不管犯了身業意業淫業罪都會被罰抱銅柱;墮落女眾被罰騎鐵牛,還有受鐵鼠咬生殖器、毒蜂蟄身、鐵火舌穿身、罰喝鐵汁等報,業報報盡的先要一批一批的轉到,馬、牛、羊、狗等圓毛畜牲道;如果再墮落,要轉身到鳥雀等扁毛飛禽類;之後再轉身蜎飛蠕動之類,如果繼續往下墮落,會轉身為細菌微塵。 我看到了一位很有修持的寺院首座師父,在地獄裡受刑,所犯罪就是因為意業淫慾罪。生前寺院開大法會時,來了一位女香客,首座師父當時正在領眾唱贊,心中僅僅一念「這麼美貌的女眾,也能信佛,真是難得」,就繼續還帶領眾僧唱贊。 他這一個微細的念頭,就造成了無法挽回的意業淫意罪,他在地獄刑罰報盡之後,轉身為貧賤男生,再遇佛法時他會被障,無緣修行,隨業流轉,愚痴造罪,越墮越深,非常可惜。 第二類 殺業罪 在墮落地獄修行人中,占的比例非常少。這一類墮落修行罪人,要到斬首地獄、斬腰地獄、剁手剁腳地獄、鐵鋸拉身等地獄受報,地獄罪業報盡,來世得短命,雷劈貧窮下賤報。 第三類 意業偷盜罪 這一類墮落地獄的時侯,修行罪人占所有墮落地獄修行人的十分之二。這類罪人要在剁手跺腳地獄、拉磨地獄、抅筋等地獄受報,地獄業報盡,會轉生到餓鬼畜牲道去。 每次想起地獄的刑罰,我就嚇得渾身冒冷汗,哆嗦成一團,與我溝通的同修,形容我懺悔時哭聲非常凄慘難聽。 我是真害怕,生前我因一念不覺造了惡業,神識隨即墮入地獄受刑,等自己覺悟了,及時懺悔改過修積功德,神識又出離了地獄,不久,我再起惡念造新業,我的神識在三年中,這樣反覆的墮入地獄受報,直至惡貫滿盈,我之所以造重罪,源於內心的惡念,所以奉勸世人一定要念頭好,心好,世間人別再象修名聞利養(講到此就沒有再講下去了)