:: Forumotion :: Hướng dẫn làm forumotion từ A-Z

Sat Aug 29, 2009 8:56 am

YaiBa1997
No.1™
No.1™

Tổng số bài gửi : 100
Join date : 21/08/2009
Tuổi : 27
Đến từ : Trần Gian

Tiêu đề: Menu dạng block

Hướng dẫn trực tiếp luôn, mấy cái kiến thức bổ trợ ko nhắc lại nữa. Đã
có post trong bài khác các bạn tự tìm nhé. sau này sẽ có 1 bài hướng
dẫn tổng quát.
Demo : trên trang portal của forum giupdo
B1: Dán code sau vào css style sheet

Trích dẫn :: #blueblock{
width: 180px;
border-right: 1px solid #000;
padding: 0 0 1em 0;
margin-bottom: 1em;
font-family: 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;
font-size: 90%;
background-color: #90bade;
color: #333;
}

* html #blueblock{ /*IE 6 only */
w\idth: 147px; /*Box model bug: 180px minus all left and right paddings for #blueblock */
}

#blueblock ul{
list-style: none;
margin: 0;
padding: 0;
border: none;
}

#blueblock li {
border-bottom: 1px solid #90bade;
margin: 0;
}

#blueblock li a{
display: block;
padding: 5px 5px 5px 8px;
border-left: 10px solid #1958b7;
border-right: 10px solid #508fc4;
background-color: #2175bc;
color: #fff;
text-decoration: none;
width: 100%;
}

html>body #blueblock li a{ /*Non IE6 width*/
width: auto;
}

#blueblock li a:hover{
border-left: 10px solid #1c64d1;
border-right: 10px solid #5ba3e0;
background-color: #2586d7;
color: #fff;
}

B2 : Dán code sau vào bất cứ chỗ nào muốn hiện menu, có thể tùy chỉnh link.

Trích dẫn :: <div id="blueblock">
<ul>
<li><a href="http://www.dynamicdrive.com/">Dynamic Drive</a></li>
<li><a href="http://www.cssdrive.com/">CSS Drive</a></li>
<li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li>
<li><a href="http://tools.dynamicdrive.com/imageoptimizer/">Gif Optimizer</a></li>
<li><a href="http://tools.dynamicdrive.com/favicon/">Favicon Creator</a></li>
<li><a href="http://tools.dynamicdrive.com/button/">Button Maker</a></li>
</ul>
</div>

P/S nếu rành css 1 tí thì có thể chỉnh màu sắc kích cỡ hiệu ứng mượt hơn đấy.

*Hãy cùng chia sẻ với bạn bè bằng cách :

Copy và gửi đến nick yahoo bạn bè!
Menu dạng block : http://www.yaiba.us.to/t34-topic :x xem rồi cho ý kiến nház :X hehe :X

Menu dạng block

Trang 1 trong tổng số 1 trang

* Viết tiếng Việt có dấu, là tôn trọng người đọc.
* Chia sẻ bài sưu tầm có ghi rõ nguồn, là tôn trọng người viết.
* Thực hiện những điều trên, là tôn trọng chính mình. -Nếu chèn smilies có vấn đề thì bấm A/a trên phải khung viết bài

Permissions in this forum:

Bạn không có quyền trả lời bài viết

Forumotion

Hướng dẫn làm forumotion từ A-Z