Share một số module Profile cho blog(Hot new)

Thư mục: Vài module profile |

Quan trọng
Đăng ngày: 20:15 01-08-2009

mấy ngày hôm nay thấy plus hơi lỗi lỗi đôi khi nhập code vào CSS lại báo lung tung , bữa nay thấy ổn ổn rồi bắt tay vào viết bài này vì nhiều anh em còn thắc mắc phần mudule profile cái mudule này cũng khá quan trọng vì nó chứa ảnh Avatar đồng thời cũng thể hiện mộ mặt của chủ nhà nữa ... nói chung làm nó thì không khó lắm có điều bà con phải biết qua phần cắt gọt ở photoshop một tý thôi ,
phần một là nói về code

#profile_highlight .rc {background:transparent url(Link ảnh Trên) no-repeat left bottom;height:X px}
#profile_highlight .rc_ft {background:transparent url(Link Ảnh Dưới) no-repeat left top;height: Y px}
#profile_highlight .rc_bd {background:transparent url(Link ảnh Giữa) repeat-x top;}
#profile_highlight .rc_bd div.rc_bc, #profile_highlight .rc_ft div, #profile_highlight .rc div,#profile_highlight .rc_bd .rc_bc .bd {background:transparent;}

đó là đoạn code quy ước chung bạn có thể biến tấu sao cho hợp lý với cái ảnh mình muốn làm ,
đầu tiên bạn tìm lấy một cái ảnh rùi cắt nó làm 3 phần trong cả ba phần bạn cắt ra thì bạn nên chọn chiều rộng cho nó là 150 còn chiều cao thì tùy ở bạn chiều cao của các phần ảnh tương ứng sẽ y hệt chiều cao trong đoạn code trên ( các chữ cái X ,Y chính là số chiều cao tương ứng ., còn phần ảnh giữa thì tốt nhất bạn nên cho nó ở trạng thái lặp bạn nha!!! , sau khi đã cắt gọt hợp lý rồi thì bạn upload 3 cái ảnh đó lên một trang nào đó như photobucket hặc trang nào mà cho phép bạn có thể lấy link ảnh ... công việc cuối cùng là thay link ảnh vào code trên rồi điều chỉnh chiều cao cho đúng với bức ảnh tương ứng , sau đó vứt

nó vô CSS là được thôi

bạn nào mà cảm thấy khó hiểu và không làm được thì đây vanhoai đã làm sẵn 6 cái cho bà con lựa chọn , quăng code của cái mà mình thích vào CSS bạn nhá, khỏe đến thế là cùng ........

code:

#profile_highlight .rc {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/05/85791247480895.jpg) no-repeat left bottom;height:48px;}
#profile_highlight .rc_ft {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/05/20691247480891.jpg) no-repeat left top;height:199px;}
#profile_highlight .rc_bd{background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/05/44671247480893.jpg) repeat-y left top;height:230px;}
#profile_highlight .rc_bd div.rc_bc, #profile_highlight .rc_ft div, #profile_highlight .rc div, #profile_highlight .rc_bd .rc_bc .bd {background:transparent;}

code

#profile_highlight .rc {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/05/28751247482790.gif) no-repeat left bottom;height:114px;}
#profile_highlight .rc_ft {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/05/27141247482788.gif) no-repeat left top;height:116px;}
#profile_highlight .rc_bd{background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/05/85321247482790.gif) repeat-y left top;height:260px;}
#profile_highlight .rc_bd div.rc_bc, #profile_highlight .rc_ft div, #profile_highlight .rc div, #profile_highlight .rc_bd .rc_bc .bd {background:transparent;}

code

#profile_highlight .rc {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/06/18341247485692.jpg) no-repeat left bottom;height:46px;}
#profile_highlight .rc_ft {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/06/20421247485696.jpg) no-repeat left top;height:149px;}
#profile_highlight .rc_bd{background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/06/66671247485697.jpg) repeat-y left top;height:260px;}
#profile_highlight .rc_bd div.rc_bc, #profile_highlight .rc_ft div, #profile_highlight .rc div, #profile_highlight .rc_bd .rc_bc .bd {background:transparent;}

code

#profile_highlight .rc {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/07/27391247487720.jpg) no-repeat left bottom;height:82px;}
#profile_highlight .rc_ft {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/07/68771247487722.jpg) no-repeat left top;height:112px;}
#profile_highlight .rc_bd{background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/07/87671247487044.jpg) repeat-y left top;height:260px;}
#profile_highlight .rc_bd div.rc_bc, #profile_highlight .rc_ft div, #profile_highlight .rc div, #profile_highlight .rc_bd .rc_bc .bd {background:transparent;}

code

#profile_highlight .rc {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/11/66501247503730.jpg) no-repeat left bottom;height:81px;}
#profile_highlight .rc_ft {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/11/45691247504119.jpg) no-repeat left top;height:100px;}
#profile_highlight .rc_bd{background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/11/27181247503731.jpg) repeat-y left top;height:280px;}
#profile_highlight .rc_bd div.rc_bc, #profile_highlight .rc_ft div, #profile_highlight .rc div, #profile_highlight .rc_bd .rc_bc .bd {background:transparent;}

code

#profile_highlight .rc {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/11/79321247502800.jpg) no-repeat left bottom;height:34px;}
#profile_highlight .rc_ft {background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/11/88141247502803.jpg) no-repeat left top;height:121px;}
#profile_highlight .rc_bd{background:transparent url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/07/13/11/12921247502801.jpg) repeat-y left top;height:280px;}
#profile_highlight .rc_bd div.rc_bc, #profile_highlight .rc_ft div, #profile_highlight .rc div, #profile_highlight .rc_bd .rc_bc .bd {background:transparent;}

ảnh minh họa ở trên còn code tương ứng ở phía giới nha bà con , bữa ny chưa có thời gian nên chỉ làm được có cái thui (thiết kế thiên về cổ điển) bữa sao rãnh làm nhìu hơn , ....