Новое горизонтальное меню для форума на uCoz | |
Сегодня мой друг сделал меню для своего форума а я решил выложить на общее обозрение. Вдруг кому-то пригодится Сразу же скажу, что само меню и рамки вокруг него полупрозрачные, а это значит, что это меню спокойно ляжет на нестандартные дизайны м нестандартными бэкграундами. Те, кто знаком с фотошопом и умеют в нём работать, наверняка "заточат" меню под свои нужды Ну что ж, приступим: Для начала создадим в файловом менеджере папку images и зальём туда две картинки: Находим тег и сразу же после него вставляем:Code <div align="center"><style type="text/css"> /* -------------------------- AUTHOR : QTV, modified by Apocalypse, 2009 Copyrights by QTV ----------------------------*/ *{ margin:0; padding:0; } body{ font:12px/18px Tahoma, Arial, Helvetica, sans-serif; } #menu{ margin:0 auto; width:800px; height:55px; background:url(/images/menu_022_bg.png) no-repeat; } #menu ul{ list-style:none; width:650px; margin:0 auto; } #menu li{ list-style:none; display:block; float:left; height:55px; line-height:55px; margin:0 0px; } #menu li a{ display:block; float:left; color:#816232; text-transform:uppercase; font-size:11px; font-weight:bold; line-height:55px; text-decoration:none; padding:0 18px; height:55px; } #menu li a:hover{ color:#6d532a; background:url(/images/menu_022_h.png) repeat-x; } #menu li a.current{ display:block; float:left; color:#6d532a; text-transform:uppercase; font-size:11px; font-weight:bold; line-height:55px; text-decoration:none; padding:0 18px; height:55px; } #menu li a:hover.current{ color:#6d532a; }</style> </div> Далее в основном теле документа нам необходимо поместить следующий HTML код:
Code <div align="center"> <table border="0" cellpadding="0" cellspacing="0"> <tbody><tr> <td width="17" background="http://apocalypse.ucoz.kz/forum_border/3bd0bff61a01.png" height="17"> </td> <td background="http://apocalypse.ucoz.kz/forum_border/290b6ff174f7.png" height="17"> </td> <td width="17" background="http://apocalypse.ucoz.kz/forum_border/94af9881da39.png" height="17"> </td> </tr> <tr> <td width="17" background="http://apocalypse.ucoz.kz/forum_border/326a55f011dc.png"> </td> <td> <div id="menu"> <ul> <li><a title="Комментарий" href="Ссылка">Название</a></li> <li><a title="Комментарий" href="Ссылка">Название</a></li> <li><a title="Комментарий" href="Ссылка">Название</a></li> <li><a title="Комментарий" href="Ссылка">Название</a></li> </ul> </div> </td> <td width="17" background="http://apocalypse.ucoz.kz/forum_border/a4e3e0816fe3.png"> </td> </tr> <tr> <td width="17" background="http://apocalypse.ucoz.kz/forum_border/8cb928874182.png" height="17"> </td> <td background="http://apocalypse.ucoz.kz/forum_border/8f85b050c329.png" height="17"> </td> <td width="17" background="http://apocalypse.ucoz.kz/forum_border/ce48d6da8a98.png" height="17"> </td> </tr> </tbody></table></div> | |
Категория: для ucoz | Просмотров: 687 | Добавил: explosiveua |
Всего комментариев: 1 | ||
| ||