文繞圖的css script
在中文Wordpress blog 內找資料, 看到這篇 “插入圖片和 Flash 的 Plugin”, 卻在文章的留言也找到好東東. 
我跟 Ivan 一樣, 在 wordpress 內, 依然用 align 的方法來製造文繞圖的效果, 但 dotann卻說:
align已经是要被xhtml标准淘汰的语法了，在css时代所有排版应该由css来完成。
原來只要在 stylesheet加上這些script 在template內:
img.right {
border: 1px solid gray;
padding: 0.5em;
margin-bottom:5px;
margin-left:10px;
float: right;
}
img.left {
border: 1px solid gray;
padding: 0.5em;
margin-bottom:5px;
margin-right:10px;
float: left;
到貼文章時, 就可以用 img class=”left”或 img class=”right” 來取替 img align=xxx,
而上述的script 更已加上了圖的padding, 甚至框框 (我是不用的) , 於是, 我連那些 hspace, vspace也可以省了~
這個方法, 應該不止適用 wordpress 的.
p.s. 試改了幾篇舊文的script 了, 效果算理想, 不過文繞圖的效果在 rss 的reader 內就沒有先前的準確及漂亮了……
Leave a Comments »
Trackback | RSS 2.0
噢, 真要多謝你了… 我一直都沒想到用css哩, 真係死蠢:mrgreen:
思存, 我都死蠢, 我又唔曉css, 更遑論php~~
妳好勁呀 css 都比妳攪好了:mrgreen:
錢老闊, 你都好勁呀! 成年之前o既文你都攪哇~ :p
btw, 自從發現了Firefox 這個叫Web Developer 的extension之後, 改css 就易多了, 有時甚至覺得改css 很好玩! :p
係呀 Web Developer 的 extension 改 css 很好玩:razz:
好簡單的 “HTML” 寫法
[...] 放心！這並不會真正改動你 blog 的CSS設定，所以就算改錯了也沒所謂，盡管放膽去試罷！注意：在改動中，不要點擊右邊的連結（mouse on 是可以的），否則左邊的 CSS script 會 reload，你之前的改動會消失的。 要偷師嗎？你可以用同樣的方法，到別人的 blog 看他的 CSS script。 給你顏色看！看到左下角的吸管 icon 嗎？只要 click 一下，再放滑鼠放到右邊的不同位置，即會顯示出顏色的代碼。（例如 Just another Sidekick 這個標題字的顏色 hex code 就是 #EDAA35）有了這兩個 extension，按圖索驥般的亂摸一通，就算不懂 CSS，也可以輕易的猜出哪一句 script 跟版面的關係。 還以顏色！ 想選另一個新顏色？可以 double click 左下角的吸管 icon，就會叫出 ColorZilla 的 Color Picker小窗口：選一個新顏色後，抄下它的hex code，放到左列的相關位置，就是改顏色的方法了。 上傳 如此這般，改好了後，”全選”左邊的CSS script，copy and paste 到 blog 內的相關管理頁面就可以了！當然，我會建議你先備份好舊的 CSS script，以防萬一！（不同的 blog system有不同的上傳方法，這裡不細表了。） 看效果 完成後，又懶得開 IE 看效果？你可以在頁面 right click 滑鼠，選”View Page in IE tab”就可以了！ 後話 大概就是這樣了，改 CSS 其實不太難嘛！就當是遊戲好了！邊改邊學，是較易上手的方法。到有興趣時，再看看其他網站的 CSS 教學罷！ 相關文章：文繞圖的css script Technorati Tags: [...]