Re: [問題] 請問CSS取代表情符號的問題~~

看板Web_Design作者 (天真可愛CQD)時間15年前 (2011/02/13 18:48), 編輯推噓3(3013)
留言16則, 3人參與, 最新討論串2/2 (看更多)
嘗試做了一個 http://pastehtml.com/view/1d7slza.html 我用的把戲是 1.把有表情圖案[:)]的部份換成 <span class="emoticon smile">:)</span> 2.emoticon設定 display:inline-block,表情圖片作為背景 然後 overflow 的部份不顯示文字,寬高=0。上左的padding=圖片寬高。 這樣內容文字在畫面上看不到,但還是複製的到。 這段 code 基本上能支援多種表情符號,不過量大時要自己改寫一下,不然 code 夭壽醜 另外是 inline-block 的 IE6 支援我印象中有問題,不確定會看起來變成怎樣 -- 這閃電拳能射出雷射光,威力每平方公分一萬億瓦特 威力無比,拳到之處,攻無不克 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 60.245.67.205 ※ 編輯: GALINE 來自: 60.245.67.205 (02/13 19:08)

02/13 19:36, , 1F
恭喜 IE8爆了...
02/13 19:36, 1F

02/13 19:42, , 2F
另外就是直接抓html出來可能會取代到標籤、script等
02/13 19:42, 2F

02/13 19:43, , 3F
PS.IE8爆了是因為進入Quirks模式 IE8 Strict沒問題
02/13 19:43, 3F

02/13 19:45, , 4F
其實我覺得IE8對標準的支援性已經很好了 會爆掉多半是進入
02/13 19:45, 4F

02/13 19:46, , 5F
Quirks模式 也就是html第一行沒有正確的DOCTYPE..
02/13 19:46, 5F

02/13 21:07, , 6F
因為比對是白名單,所以應該是不會取代到不該取代的東西
02/13 21:07, 6F

02/13 21:08, , 7F
不過另一個原因是我不知道怎麼用純DOM的方式來做,畢竟[:)]
02/13 21:08, 7F

02/13 21:08, , 8F
不是DOM元素,我只會用字串比對來抓[汗]
02/13 21:08, 8F

02/13 21:09, , 9F
BTW,如果只加上Doctype就能在IE上顯示正常的話,那我會
02/13 21:09, 9F

02/13 21:09, , 10F
有點驚訝 XD
02/13 21:09, 10F

02/13 22:51, , 11F
感謝GALINE大這招~學起來了!!
02/13 22:51, 11F

02/13 22:51, , 12F
附帶請教一下~圖片我有辦法指定大小嗎?~若是字型為12px
02/13 22:51, 12F

02/13 22:52, , 13F
我把圖片設成12X12size就會大小較剛好~不設定他會以icon的
02/13 22:52, 13F

02/13 22:53, , 14F
原始大小呈現~看起來就很突兀
02/13 22:53, 14F

02/13 23:09, , 15F
可以把Padding設成1em,不過我覺得綁圖片大小會比較安全
02/13 23:09, 15F

02/13 23:10, , 16F
另外也可以把大小寫到smile跟sad裏面,每張圖分別指定
02/13 23:10, 16F
※ 編輯: GALINE 來自: 211.73.175.49 (02/13 23:11)
文章代碼(AID): #1DLxRnrv (Web_Design)
文章代碼(AID): #1DLxRnrv (Web_Design)