Вот еще наброски:
[Выполнено] Таблица. Волки. HTML
Сообщений 11 страница 14 из 14
Поделиться1124.07.13 22:16
- Бестелесный дух прошлого
- Уважение: +95
Поделиться1225.07.13 13:06
- Бестелесный дух прошлого
- Уважение: +394
Роллен
Принимаю 
Поделиться1325.07.13 14:31
- Бестелесный дух прошлого
- Уважение: +394
Роллен
Смотрим:
http://pmtest.mybb.ru/
HTML-верх
Код:<style> .container1 {width: 900px; margin: 0 auto; padding: 0;} ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 40px; width: 100%; margin-left: 250px; font-size: 14px; } ul.tabs li { float: left; margin: 0; padding: 0; height: 40px; line-height: 40px; border: 0px; border-top: 1px dotted #000000; border-bottom: 1px dotted #000000; border-right: 1px dotted #000000; border-left: 1px dotted #000000; margin-bottom: -2px; background: rgba(212, 240, 236, 0.78); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; overflow: hidden; position: relative; } ul.tabs li a { text-decoration: none; color: transparent; display: block; padding: 0 5px; background: url(); outline: none; } ul.tabs li a:hover { background: url(); border-bottom: 0px solid #000000; border-top: 0px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; } html ul.tabs li.active { background: rgb(212, 240, 236); border-radius: 7px; } html ul.tabs li.active a:hover { background: url(); border-bottom: 0px solid #160f0a; } .tab_container1 { clear: both; float: left; width: 900px; height: 343px; background: rgb(187, 219, 215); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border-bottom: 1px solid #000000; border-top: 0px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; -moz-border-radius-bottomright: 5px; -khtml-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -khtml-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; } .tab_content { padding: 5px; } .tab_content h2 { font-weight: normal; padding-bottom: 2px; border-bottom: 0px dashed #000000; } </style>
HTML-низ
Код:<script type="text/javascript"> $(document).ready(function(){ $('.splLink').click(function(){ $(this).parent().children('div.splCont').toggle('normal'); return false; }); }); </script> <script type="text/javascript"> $(document).ready(function() { $(".tab_content").hide(); $("ul.tabs li:first").addClass("active").show(); $(".tab_content:first").show(); $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("active"); $(this).addClass("active"); $(".tab_content").hide(); var activeTab = $(this).find("a").attr("href"); $(activeTab).fadeIn(); return false; }); }); </script>
Объявление
Код:<ul class="tabs"> <li class="active"><a href="#tab1">Главная</a></li> <li><a href="#tab2">Карта</a></li> <li><a href="#tab3">Игра</a></li> <li><a href="#tab4">Гордость форума</a></li> </ul> <div class="tab_container1"> <div style="display: block;" id="tab1" class="tab_content"> <table border="1" cellpadding="1" cellspacing="1" style="width: 890px; height: 330px; "> <tbody> <tr> <td rowspan="2" style="text-align: center; overflow: auto; overflow-x: hidden; width: 200px;"> <div style="height: 300px; text-align: center; overflow: scroll; overflow-x: hidden; width: 200px;"> <strong>Новостной блок</strong> <p>Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст </td> <div> <td style="text-align: center;"> <strong>АМС</strong></td> <td rowspan="2" style="text-align: center;"> <b>Объявелния</b></td> <td rowspan="2" style="text-align: center;"> <strong>Навигация</strong></td> </tr> <tr> <td style="text-align: center;"> <strong>Акции, конкурсы</strong></td> </tr> </tbody> </table> </div> <div style="display: none;" id="tab2" class="tab_content"> /место_под_меп_карту/ </div> <div style="display: none;" id="tab3" class="tab_content"> <table border="1" cellpadding="1" cellspacing="1" style="width: 890px; height: 330px;"> <tbody> <tr> <td colspan="1" rowspan="2" style="text-align: center;"> <strong>Квесты</strong></td> <td style="text-align: center;"> <strong>Дата</strong></td> <td colspan="1" rowspan="2" style="text-align: center;"> <strong>Лучший пост</strong></td> </tr> <tr> <td style="text-align: center;"> <strong>Отыгрыши</strong></td> </tr> <tr> <td style="text-align: center;"> <strong>Погода</strong></td> <td colspan="2" rowspan="1" style="text-align: center;"> <img alt="" src="ссылка_" /></td> </tr> </tbody> </table> </div> <div style="display: none;" id="tab4" class="tab_content"> <table border="1" cellpadding="1" cellspacing="1" style="width: 890px; height: 330px;"> <tbody> <tr> <td style="text-align: center;"> <strong>Волк месяца</strong></td> <td style="text-align: center;"> <strong>Человек месяца</strong></td> <td style="text-align: center;"> <strong>Админ месяца</strong></td> <td style="text-align: center;"> <strong>Модер месяца</strong></td> </tr> </tbody> </table> </div> </div>
Подробнее об оформлении здесь -> Контейнер с вкладками для информации [Герда]
Поделиться1425.07.13 18:53
- Бестелесный дух прошлого
- Уважение: +95
Jii-Jo
Супер! Спасибо большое! 
