close

突然間心血來潮,想要大改部落格、相簿、名片、留言版。心裡打好了草稿,要做出一個藍色極簡的風格。

終於!花了約36H的時間(當然包含吃飯、睡覺、看電視),藍色極簡的風格終於完成了。完成的那一瞬間充滿了成就感,也終於鬆了一口氣,也就在今天藍色極簡風版面問市了,特以此文詳以記載。

1。|部落格 Blog:

這花最長的時間,對我來講CSS可不是這麼好修改的,用半生不熟的功力完成了這樣的版面,我為自己打80分。而最有成就感的就是位於上方的功能鍵,在亂配色之間,莫名其妙的做出像按鈕樣式的功能鍵,我超喜歡的。還有位於左側的"扛棒",這配色也是我突然想到的好方法,用PhotoImpact配出來,滿意! (建議解析度:1280*1024 or 以上喔!)

  未命名.jpg

部落格上半部。

未命名2.jpg

回應欄。改到差點哭出來,那些input的元件,花了我好多時間去找他的程式碼。

2。|相簿 Album:

相簿有三層是我感到最麻煩的一個地方,除了第一層的地方可預覽之外,第二、三層都必須儲存之後,按重新整理才可以看到變動。曾有兩次不小心按到上一頁把CSS表全部歸回原點,這讓我差一點沒瘋掉,秉持著自己強大的意志力終於完成了。而相簿讓我最有成就感的地方就是顯示單張照片的13px的白色裏灰色外框,這讓讀者看起來照片美觀多了。再來是相簿中的留言功能,由於已經有留言版了,故把此功能關閉。

未命名3.jpg

相簿的第一層。第二層與第一層大同小異。

未命名4.jpg

第三層,照片有沒有比較好看?!  標題也讓我滿意!

3。留言版 Guestbook:

這也分了兩層,讓我不得不儲存再重新整理。而且有些垂直顯示的功能要變平型顯示,可廢了我好大的功夫,這也讓我更懂CSS的操作了。再說隱藏留言的樣式,還要登出才可以看到,幸好我firefox與IE共用,讓我免去許多的時間。就等你們留言觀看我的成果嚕^^。

也謝謝留言版,讓我靈機一動要如何改圖片的大小,也順便把部落格的顯示變小了。最難的是[我要留言]的頁面,又是input讓我吃盡了苦頭,到現在"記住我的資訊"還是無法移到左邊,望請各位可以幫我一個大忙,有人知道這個元件名嗎。

 

未命名5.jpg

留言版最上方,其實也只有這邊有文字,沒有人給我留言,哭哭...

未命名8.jpg

[我要留言]的內容,圖中圈起來的就是我有問題的地方。

4。|名片 Profile:

這是我改的最快速最高興的,唯獨就只有申請加入好友最麻煩,還要登出、要設定float...等的。當初我設定好他的顯示模式在IE下是水平模式,在firefox下是垂直模式(胡亂設定的結果),本來想說這樣蠻特別的,不過在一致心的作祟下,我還是把它改成兩種瀏覽器都是以水平發是呈現了。

唯一感到美中不足的一點,就是這頁面太空了,改天如果還記得的話,我會請禿頭峰幫我畫個大圖,拿來當本頁的背景。

未命名7.jpg

END。|感想 Idea:

自從這次大改版面之後,我想很多日子以內我絕對不會在大改它了。改CSS需要極大的構想能力、還要些許的注意力、更重要的是你的意志力要強,不然你像我按到了幾次的回上一頁、或關掉視窗,你就有得哭了。不過還有些想要小改的地方,而這些小改的地方只是需要圖片背景而以,這不會讓我相當的煩惱,就等我請禿頭峰畫出來之後再完美的補完吧!(終於又可以繼續打Bali遊記了,ya!!)

arrow
arrow
    全站熱搜

    bu015339 發表在 痞客邦 留言(2) 人氣()