【Murmur】自製(偽)愛馬士小姐



↑這是用Chrome所顯示出來的樣子,用其他瀏覽器看起來可能會不太一樣就是。

有鑑於I SAY倒了之後,現行的微網誌平台都有很高的互動成份,雖然可以跟人瞎聊互動也沒什麼不好,但偶爾還是會滿想念以前I SAY那種毫無互動功能可言的murmur用小掛件,當作自己碎唸用或公告性質的一個小空間。

而噗浪跟推特雖然都有提供類似的掛件可放在部落格上,但是我覺得他們的掛件樣式都很醜(喂),最後我就想說,那看能不能用HTML或CSS寫一個類似的東西出來,主要是我想要放自己喜歡的素材這樣(巴)。

總之,最後改出來的結果誠如上圖所示,其實說穿了他就是一個邊框而已,像這類邊框的素材跟語法去Google就可以找到很多,也有人是放整組自製的邊框素材語法出來,喜歡的話就直接複製回去用就好了,但我用的素材是自己抓圖回來改的(出處是一個叫【人形首】的日本素材站),所以這裡就只放語法,底圖素材你要自己去找或自己做才行。(毆)

以下是我用的語法:

<div align="center">
<table id="table1" height="400" cellspacing="0" cellpadding="0" width="196" background="底圖網址" border="0">
<tbody>
<tr>
<td>
<br /><br />
<div align="right">
<div style="SCROLLBAR-FACE-COLOR: #ffffff; MARGIN: 50px 5px 0px 0px; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: auto; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ffffff; COLOR: #ffffff; WORD-BREAK: break-all; SCROLLBAR-3DLIGHT-COLOR: #ffffff; SCROLLBAR-ARROW-COLOR:ffcccc; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR:#ffffff;FILTER: Chroma(Color = #ffffff); HEIGHT: 260px">
<div align="left">
<font color="pink">
你想輸入的文字
</font>
</div></div></div>
</td></tr>
</tbody>
</table>
</div>

因為這個語法是改來的,所以我不曉得是不是有一些多餘的語法我沒拿掉(我好像多了一些</div>或<br />?),而且這是只適用於我的底圖的語法,如果你要用的話就必須照自己的需求去改,我的底圖長寬是400x196,如果你的底圖比較大或小就要自己去改那個Height跟Width,幾個改作要點如下:

※底圖網址:請自行尋找素材圖上傳到自己的空間,這裡不提供,不過你爽的話可以拿我畫的圖去改。(←誰要啊)

※第一個Height跟Width:整個底圖的長跟寬。

※第二個Height跟Width:文字內框的長跟寬。

※中間那一堆Color #ffffff:捲軸的顏色。(這裡預設是黑色,不過好像只有在IE中才會顯示出來)

※Margin:文字內框跟外框的上下左右間距,可以隨便改他後面那堆數字,改到你順眼為止。

※你想輸入的文字:就是你碎碎唸或公告用的內容,前面的font color是文字顏色,如果不要粉紅色的話請自改,另外,輸入文字的時候如果要斷行請用<br />斷行,不然會黏在一起。

※第一個div align=center:整個框架置中。

※第二個div align=right:文字內框置右。

※第三個div align=left:文字置左。


大概就這樣,然後如果都這樣列出來了你還是看無不會改,或是還要來問大大這個語法要放在哪邊啊?你需要的是Google,不是我,謝謝。

留言

隨機文章(踩雷區)

熱門文章