[Code Css 360 New Plus] Trang Trí Module Profile

Hôm nay 07/06/2010 các kỹ sư Yahoo lại sửa code Plus. Code nút home cũ không được. Ta sẽ có code mới

Quote:

#profile_highlight .backhome{background:transparent url(Link hình) no-repeat bottom;height:Apx;}/*olympia41124*/

Trong đó thay link hình bằng link hình bạn muốn. Thay A bằng chiều cao nút home bạn muốn chèn.

Lưu ý nút home này chỉ để trang trí, muốn quay về home thì bạn cần nhấp vào chữ "Trang chủ 360Plus" ngay trên. Không thể dùng CSS để "ép buộc" sao cho khi nhấp vào nút home thì quay về trang chủ được. Và tất nhiên vì vậy nên sẽ không có thủ thuật hover cho nút home <IMG title=laughing alt="" border=0>





Trong suốt phần thêm bạn và "Thao tác khác"

Quote:

#profile_highlight #profile_nav{background:transparent;}/*olympia41124*/

Lưu ý code trên chỉ trong suốt bổ sung thêm phần mới cập nhật thêm ngày 07/06/2010 nên nếu muốn trong suốt toàn bộ module đó thì tham khảo bài viết sau >>> [360Plus Beta Medium] Trong suốt toàn bộ blog 360Plus Beta - Trang chính





Thay icon thêm bạn

Quote:

#profile_highlight #addtofriends_ctn {background:transparent url(Link hình) no-repeat left top;text-align:center;height:Apx;}/*olympia41124*/

Trong đó thay link hình bạn muốn, A là chiều cao icon muốn chèn, trong text-align:center có thể thay bằng text-align:right tùy thích.


Thay icon đầu dòng "Thao tác khác"


Quote:

#profile_highlight #profile_nav ul li .yui3-menu-label{padding:1.6em 0.5em 1.5em 2em;background:transparent url(Link hình) no-repeat left center;}/*olympia41124*/

Trong suốt phần mở rộng của "Thao tác khác"

Quote:

#profile_highlight .yui3-menu-corner,#profile_highlight .yui3-menu-corner div,#profile_highlight .yui3-menu-corner-bl,#profile_highlight .yui3-menu-corner .yui3-menu-corner-tr,#profile_highlight .yui3-menu-corner-br,#profile_highlight #profilemorelinks .yui3-menu-content{background:transparent;border-style:none;}/*olympia41124*/

Thay nền cho phần mở rộng của "Thao tác khác"

Quote:

#profile_highlight #profile_nav .yui3-menu ul.first-of-type{padding:10px 0 0 0;}/*vietnam360plus.com*/ #profile_highlight #profilemorelinks .yui3-menu-content{background:transparent url(Link hình) top center;}/*olympia41124*/

Thay icon đầu dòng cho phần mở rộng của "Thao tác khác", phần tải ảnh và sửa hồ sơ.

Quote:

.yui3-menuitem-content{padding:0 0.5em 0 1.5em;background:transparent url(Link icon) no-repeat left top;}/*olympia41124*/

Thay icon cho toàn bộ phần thêm bạn, thao tác khác, sửa hồ sơ, tải ảnh, phần mở rộng của thao tác khác


Quote:

#profile_highlight #profile_nav .yui3-menu-content ul li{padding:0 0.5em 1em 1.5em;background:transparent url(Link icon) no-repeat left top;}/*olympia41124*/

Hiệu ứng nút ấn cho phần mở rộng của "Thao tác khác"

Quote:

#profile_highlight .yui3-menuitem-active, #profile_highlight .yui3-menu-label-active, #profile_highlight .yui3-menu-label-menuvisible{background:transparent url(Link hình) top center;}/*olympia41124*/

Written by olympia41124 - http://forum.vietnam360plus.com



3_ Trang Trí Nick Name

Ở bản beta thì nickname dường như được "vỗ béo" nên to đột biến





Vì vậy ta sẽ cần code chỉnh sửa lại các thuộc tính của nickname


Quote:
#profile_highlight .nickname a{
background:transparent url(Link);
font-weight:normal;
font-size:100%;
font-family:Tahoma;
color:#FF00FF;
text-decoration:blink;
}/*olympia41124*/

Trong đó

background:transparent url(Link) có thể chèn một link hình tuyết rơi tạo hiệu ứng cho nick
font-weight:normal là để kiểu chữ bình thường, mặc định đã là kiểu chữ đậm
font-size:100% quy định kích cỡ font chữ, có thể thay 100% bằng 90%, 80% ... hoặc 12px, 14px ...
font-family:Tahoma quy định kiểu chữ, có thể thay Tahoma bằng Arial, Georgia ...
color:#FF00FF quy định màu sắc font, có thể thay mã màu tùy ý
text-decoration:blink hiệu ứng nhấp nháy (không hiển thị trên IE)

Nếu không muốn dùng phần nào chỉ cần bỏ dòng đó trong code đi

Ngoài ra ở module này còn có thể chèn hình vào phần ngay dưới nickname, thay link hình thích hợp và A là chiều cao của hình


Quote:
.zodiac{background:transparent url(Link) no-repeat center;height:Apx;}/*vietnam360plus.com*/




4_ Thay đổi Avartar Động

Thực ra avatar động này chỉ hiển thị ở blog của chính bạn thôi, còn khi bạn đi comment ở blog khác thì avatar vẫn là avatar bình thường không phải hình động.

Sử dụng code sau để chèn avatar động

Quote:
#profile_highlight img{height:0;}/*olympia41124*/
#profile_highlight .profile_photos{background:url(https://2img.net/h/i118.photobucket.com/albums/o93/olympia41124/vietnam360plus/76uh876.gif) no-repeat center;height:420px;}/*vietnam360plus.com*/

Trong đó thay https://2img.net/h/i118.photobucket.com/albums/o93/olympia41124/vietnam360plus/76uh876.gif bằng link hình bạn muốn làm avatar động, và height:420px quy định chiều cao của hình, bạn có thể thay 420 bằng chiều cao của hình bạn muốn chèn. Nếu muốn cân đối cho đẹp thì có thể tăng thêm 20px. Ví dụ hình trên là 400px thì ta ghi là height:420px.