免費論壇 繁體 | 簡體
Sclub交友聊天~加入聊天室當版主
分享
新浪微博
QQ空间
Facebook
Google+
Plurk
Twitter
Line
返回列表 發帖

Rank: 7Rank: 7Rank: 7

積分
5068 
威望
5068  
金錢
2878  
最後登錄
2024-10-30 

熱心會員貢獻特別級會員資深版主正式版主中級會員高級會員金牌會員論壇元老
1# 跳轉到 » 倒序看帖
打印
tT
无界發表於 2016-12-21 20:48 | 只看該作者

[版型教學] 分享一款头像圆角代码，加阴影立体效果。

效果如图：
QQ截图20161221203848.jpg
将下边代码放到css_common模板最下边即可。
  1. .postauthor .avatar a img {
  2.     width: 100%;
  3.     border-radius: 50%;
  4.     border: 5px solid #FFF;
  5.     box-shadow: 0px 6px 20px 0px rgba(0,0,0,.19),0px 8px 16px 0px rgba(0,0,0,.2);
  6. }
複製代碼
1

評分人數

收藏 分享
爱秀代码

Rank: 8Rank: 8

積分
4940 
威望
4940  
金錢
8004  
最後登錄
2024-3-4 

中級會員高級會員金牌會員論壇元老熱心會員
2#
leisurema發表於 2016-12-21 21:12 | 只看該作者
回復 1# 无界



收到了，辛苦無界大人啊！

TOP

Rank: 7Rank: 7Rank: 7

積分
873 
威望
873  
金錢
199  
最後登錄
2024-3-30 

中級會員高級會員正式版主
3#
21648069發表於 2016-12-21 23:48 | 只看該作者
本帖最後由 21648069 於 2016-12-22 00:05 編輯

回復 1# 无界

請問可以修改成能夠套用到 onmouseover 上面嗎？
也就是鼠標移到頭像上面的時候，圓角依舊維持，不會恢復成四角形

很需要這個代碼

TOP

Rank: 7Rank: 7Rank: 7

積分
5068 
威望
5068  
金錢
2878  
最後登錄
2024-10-30 

熱心會員貢獻特別級會員資深版主正式版主中級會員高級會員金牌會員論壇元老
4#
无界發表於 2016-12-22 00:21 | 只看該作者
回復 3# 21648069


    再加一句
  1. .popavatar a img {border-radius: 50%;}
複製代碼

TOP

Rank: 7Rank: 7Rank: 7

積分
873 
威望
873  
金錢
199  
最後登錄
2024-3-30 

中級會員高級會員正式版主
5#
21648069發表於 2016-12-22 02:03 | 只看該作者
回復 4# 无界

感謝大神，幫了大忙

TOP

Rank: 7Rank: 7Rank: 7

積分
8659 
威望
8659  
金錢
10077  
最後登錄
2024-10-31 

中級會員高級會員金牌會員論壇元老正式版主資深版主熱心會員
6#
4rphotoclub發表於 2016-12-22 03:01 | 只看該作者
看似很有效果，等我又试下效果是如何！
歡迎大家齊來加入4R網上攝影會

TOP

Rank: 7Rank: 7Rank: 7

積分
2493 
威望
2493  
金錢
2110  
最後登錄
2020-7-18 

金牌會員正式版主
7#
哥哥發表於 2016-12-23 16:37 | 只看該作者
无界大大你太狂了
SCLUB/Discuz 7.2!代码美化中心

TOP

返回列表