Re: [Blogger] 官方版本留言頭像功能發布
※ 引述《jtmh (慘。累。)》之銘言:
: 更正:事實證明我錯了,Blogger Buster 上已經有讀者留言提出方法:
: .avatar-image-container img {
: background: url(
: http://i860.photobucket.com/albums/ab162/LeBloggerTemplate/LeBlogger.jpg);
: width: 35px;
: height: 35px;
: }
: 原文網址請參閱 http://tinyurl.com/mqhm53 。
[...]
: 更正關於無法在頭像功能中顯示匿名人像,甚至把圖示都改成 35x35 像素的描述,
: Blogger Buster 上已經有讀者留言提出以 CSS 的方式來達成該目標。
: ※ 編輯: jtmh 來自: 218.175.148.125 (09/20 20:43)
: 推 hguei:強制35*35會使得部分頭像變形~所以不是完美解 09/21 21:03
: 推 kevin814:要保持長寬比好像可以試試看jQuery..又會拖到讀取速度orz 09/21 22:30
頭像以 35x35 像素顯示是這次官方頭像功能預設的做法,
並不是 Blogger Buster 上那位讀者自己定的,
不過倒是真的有非常少部分的頭像會以非 35x35 正方顯示,
我印象中有看過一次是顯示成長方形的,但原因不明。
Blogger Buster 那位讀者提出的方法主要的缺點在:
1. Blogger 留言者未設頭像時
2. OpenID 使用者留言時
上列兩種情況下會分別顯示以前就有的 16x16 的 Blogger 與 OpenID 圖示,
但是因為他在 CSS 中指定以 35x35 顯示,所以圖示看起來會放大失真。
這個問題在 http://www.bloggerplugins.org/ 有篇文章用了其他方法避掉了,
文章網址在 http://tinyurl.com/ltr9re ,他的寫法是:
.avatar-image-container {
background: url(http://2.bp.blogspot.com/_u4gySN2ZgqE/SrTInZfKwVI/
AAAAAAAAAwA/xaGlRIqkHDw/s400/default.gif);
width: 35px;
height: 35px;
}
.avatar-image-container img {
border: none;
}
基本上他是把要加入的那張背景圖改放在 .avatar-image-container,
而非其內的 img,因此在 img 中的 Blogger 或 OpenID 圖示就不會失真了,
Blogger 或 OpenID 圖示會變成顯示在背景圖的右上角,請參考:
http://img441.imageshack.us/img441/8326/avatarh.png
這樣感覺好像有比較好看一點 @@?
另外,在找相關資料的過程中,我發現了一篇很棒的頭像 CSS 調整文章:
http://tinyurl.com/n4h3yf (經 Google 翻譯為英文版,有些 CSS 碼亂掉了)
http://tinyurl.com/my8glr (原文版,西班牙文,請對照上面英文版服用)
裡面講到了如何把頭像移到留言的右側、如何只針對非頭像的部分修改…等,
有興趣想做這方面微調的版友可以參考看看。
--
▂ ▅ ▄▃ ▄ ▃ ▃
﹉ ? ﹉▇ 有時候逃避, 是因為面對太麻煩。 =╬=╬=
ForSinSoKing@Ptt ___ ___★ ▃
? = =?= ___ ___ ▊|▎ ▊|▎ =?=
◢ ◣ ▂﹎▲▃ ▁ ▊|▎ 鵝▊|▎▂▃▊ ▎▲▃ ▊ ▎▃▂▲ ▂
╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬=╬ =╬ForSinSoKing
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 218.175.144.34
推
09/22 14:50, , 1F
09/22 14:50, 1F
→
09/22 14:51, , 2F
09/22 14:51, 2F
→
09/22 17:12, , 3F
09/22 17:12, 3F
→
09/22 17:13, , 4F
09/22 17:13, 4F
→
09/22 17:16, , 5F
09/22 17:16, 5F
推
12/15 18:38, , 6F
12/15 18:38, 6F
討論串 (同標題文章)
本文引述了以下文章的的內容:
完整討論串 (本文為第 3 之 3 篇):