給只會26個英文字母的人學的@@"
或是..完全不懂英文~_~
這篇需要很大的耐心+毅力!!
全部看完才會懂喔=口=?
第1步驟： 基礎認識
background → 背景
border → 邊框
color → 文字顏色
↑以上英文謹記!!!(不用死背!!看的懂就好..)
＊好的開始，是成功的第一步^^＊
另外 , 如果你記不住 ,可以寫↓
/* */ → 註解 (將你想說的文字寫進去,程式不會執行)
ex:
/* 這個單字是背景喔!!
*/ → 用註解把『這個單字是背景喔!! 』包夾起來。
﹥如果你比較喜歡這種文字說明的,可以參考
如語娃娃(indream228) - 【小屋】CSS自訂版面
﹥我家是看圖說故事啦=口=||| (搞狗仔@O@?)
＊努力做筆記，才能學的更快唷^^＊
然後你打開css..
看到....
什麼鬼~
怎麼
border 後面還有
-top -right -bottom -left
老子英文真的非常不好!!!
＊加油，css的英文不難^^＊
第2步驟： 認識邊框
border-top →
上面框線
border-right →
右邊框線
border-bottom →
下面框線
border-left →
左邊框線
用你
最大的想像力去記住後面那四個英文
＊加油，已經學會一半囉＊
第3步驟： 邊框的設定
border-top:#FFF 1px dashed; → 邊框上方 : 顏色 線條粗細 虛線
border-top:#FFF 1px solid; → 邊框上方 : 顏色 線條粗細 實線
＊加油，讓你的小屋顏色更豐富^^＊
第4步驟： 顏色
好~以上都記住以後~
來開始填顏色
background:#000000; ←背景色 : #000000 顏色的代碼
可以到
色碼表選擇你喜歡的顏色 , copy過來
＊讓小屋變的很有個人風格的重要步驟=ˇ=趕快繼續看下去!!＊
第4-1步驟： 放圖片
background:url(http://你圖片的網址); ← 圖片重複
background:url(http://你圖片的網址) no-repeat; ← 圖片不重複
圖片要上傳喔!! 可以上傳到這裡..
樂多日誌(這個可以上傳大大大圖,不過有時候會維修~_~)or
photobucket←這英文的,不過比較穩定!!---這裡有詳細的
潛艇C號(cyclops87) - 帳號申請教學
★注意：不能同時寫background:#000000; 和background:url(http://你圖片的網址); 有時候顏色會蓋過圖片。
＊加油，讓小屋更有一整體性=ˇ=＊
第5步驟： 文字
color: #006699; → 文字顏色
font-weight: bold; → 文字粗體
text-align: center; → 文字置中
text-align: left; → 文字置左
text-align: right; → 文字置右
font-size: 12pt; → 文字大小
＊基礎語法都知道囉，要改哪裡呢 ?＊
第6步驟： 修改
有了以上的認識以後 ,
就可以修改你想要的部分了!!
到這篇
css - 導引看你想要修改哪裡,就點哪張圖進去..
進去後你會看到..
.banner { background....
border-top:.... }
沒錯!!那張圖所修改的部位就是
.banner{} ←把你想要的效果放在
｛ ｝ 內
而
.banner就是那個部份的
標籤唷!!
＊下面很重要喔!!免的小屋變的一片白@O@"＊
第7步驟： 注意事項
記得..
每一句語法
background : #000000 ;
﹥都會有
冒號(：)開始 和
分號(；)結尾
每個標籤
.banner { background....}
﹥都會有
｛ ｝ 把語法包進去
＊當你看到這，還想往下看，恭喜，你已經脫離初初初學者囉^^~＊
第8步驟： 不滿足
如果以上的設定無法滿足你的需求..
請到
css - 語法說明看..你想要的..語法..(不過還是簡化很多><)
＊趕快動手改小屋吧~你也能變大師!!!＊
(我不是大師啦..我還是初初學者) [ 比你少一個初=口=||| ]
...
創作內容
css - 超級新手教學
css (48)