ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка

Объявление

Загадочный Дом «Кузнечик»

Форумные игры, кино, позитивное отношение и душевное общение!
Есть в мире место, где душе тепло...
Заходи, мы будем тебе рады!

Подробнее

Мийрон

Качественный пиар быстро и недорого.
Красивейшие дизайны по низким ценам.
Каталог ролевых игр.

Подробнее

Дизайн «Warlords of Draenor»

Детализированный rpg-дизайн для MyBB форума гильдии «Warlords of Draenor»
Стоимость при покупке эксклюзивно: 6300р
В стоимость входит настройка и корректировка дизайна под ваш проект.

Подробнее

Светлый дизайн в фентези стиле с аниме-графикой

Макет для светлого дизайна в фентези стиле с аниме-графикой.
Стоимость: 2600р*
Дизайн продается эксклюзивно (в одни руки).

Подробнее

Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Реклама на сайте
Стать модераторомОтзывы

Предложения

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка » Верстка и скрипты » (БЕСПЛАТНО) / Кодинг: объявления. Таблица шапки


(БЕСПЛАТНО) / Кодинг: объявления. Таблица шапки

Сообщений 21 страница 30 из 35

21

Герда написал(а):

например, не удобнее ли вторую часть таблички засунуть на вкладку "мир"?

Это прекрасная идея, спасибо!
Удобно ли будет переименовать вкладки мир и новости, поменяв их местами, чтобы по умолчанию первым был он, оставить в нем Мир со скрина (нижнюю часть), а к новостям на второй вкладке запихнуть новости и оставить новые кнопки "Что творится" и т.д.? По факту они элемент новостей, но на главной все никак не смотрятся.
Буду рыдать от счастья с возможностью все редактировать...

Отредактировано Helheima (21.11.2020 23:05:57)

0

22

И во второй кнопке наши новые кнопки оставить под новостями
https://forumuploads.ru/uploads/0007/e3/f7/7039/t832180.png

0

23

Helheima написал(а):

Удобно ли будет переименовать вкладки мир и новости, поменяв их местами

да, теперь это легко делается

Helheima написал(а):

а к новостям на второй вкладке запихнуть новости и оставить новые кнопки "Что творится" и т.д.?

а что должны делать эти кнопки?

0

24

Герда написал(а):

а что должны делать эти кнопки?

Так, как сейчас они нажимаются и открывается текст, так же пусть и работают, как спойлеры. Там внутри будет только текст и пара картиночек для оформления, оно растянется в высоту под это? Если есть ограничение я туда могу короткие штуки вставить.

Отредактировано Helheima (21.11.2020 23:41:13)

0

25

Helheima написал(а):

Там внутри будет только текст и пара картиночек для оформления, оно растянется в высоту под это? Если есть ограничение я туда могу короткие штуки вставить.

я могу ничего не делать - тогда по клику сколько текста впихнешь - такая высота и будет.
могу сделать прокрутку, чтоб если много было текста, блок не разъезжался на большую высоту.

0

26

Герда написал(а):
Helheima написал(а):

Там внутри будет только текст и пара картиночек для оформления, оно растянется в высоту под это? Если есть ограничение я туда могу короткие штуки вставить.

я могу ничего не делать - тогда по клику сколько текста впихнешь - такая высота и будет.
могу сделать прокрутку, чтоб если много было текста, блок не разъезжался на большую высоту.

Пусть будет по тексту высота, так и оставляйте!

0

27

Helheima
Коды

это в стиль (конец любого окна)

Код:
/********** Стиль таблицы в объявлении **********/
 /*****************  © ForumD.ru ****************/
.s-tabs{
width: 100%;
display: block;
text-align: center;
}
.stab {height:auto;}
.s-tabs span {
cursor: pointer;
font-family: Georgia;
font-size: 46px;
text-transform: uppercase;
padding: 4px 20px;
transition: color 0.3s;
-webkit-transition: color 0.3s;
display: inline-block;
color: #000;
}
.s-tabs span:hover,
.s-tabs span.selected{
color:#fff;
}
.s-tabs .stab {
width:auto;
margin:0;
display:none;
overflow-x:hidden; 
padding: 10px;
}

#s-block {
width: 100%; 
display: block;
margin-bottom: 10px;
text-align: left;
}

#s-block #left, #s-block #right {
display: inline-block;
width: 170px;
vertical-align: top;
text-align: left;
}

#s-block #center {
display: inline-block;
width: calc(98% - 350px);
text-align: center;
margin: 0 1%;
vertical-align: top;
}

#s-block #center.news {
max-height: 170px;
overflow-y: auto;
text-align: left;
}

#s-block #center.pic img {max-width: 100%;}

#s-block #center b {
font-weight: normal;
font-size: 15px;
display: block;
margin-bottom: 5px;
}
#s-block #center b img {
max-width: 15px;
max-height: 15px;
position: relative;
top: 2px;
padding-right: 5px;
}

.s-tabs h3 {
font-weight: bold;
color: #e3e3e0;
font-size: 18px;
font-family: 'Courier New';
margin-bottom: 4px;
}

.s-tabs h3 img {
max-width: 18px;
max-height: 18px;
position: relative;
top: 2px;
padding-right: 5px;
}

.s-tabs .sami-icon {
position: relative; 
display: inline-block;
margin: 0 5px 5px;
text-decoration: none;
}
.s-tabs .sami-icon img {max-width: 60px;}
.s-tabs .sami-icon i {
position: absolute; 
background: rgba(0, 0, 0, 0.8);
opacity: 0;
transition: all 0.6s;
-webkit-transition: all 0.6s;
padding: 5px;
white-space: nowrap;
margin: 0 3px 6px;
bottom: 0;
}
.s-tabs .sami-icon:hover > i {opacity: 1; color: #fff; z-index: 99999;}


.s-tabs a.link {
display: block;
color: #d4d4d4;
border-left: 3px solid #fafdfd;
background-color: #000000;
padding: 4px;
text-decoration: none;
font-family: Century Gothic;
font-size: 14px;
}
.s-tabs a.link:hover {
background-color: #d9d4ff;
border: none;
color: #151515;
}

#menu {text-align: center; margin-bottom: 6px;}
#menu .spll {
width: auto !important;
height: auto !important;
display: inline-block;
}
div .splLink {
border: 1px solid #bfbfbf;
background: #000;
text-align: center;
font-family: Century Gothic;
font-size: 18px;
padding: 4px !important;
width: auto !important;
height: auto !important;
cursor: pointer;
}
.splCont {
display: none; position: absolute;
    height: auto;
    background: #000;
    padding: 5px;
    z-index: 1000;
    margin-top: 5px;
    border: 1px solid #7b7b7b;
    font-size: 16px;
    font-family: Microsoft Sans Serif;
    text-align: center;
}

.pic_block {display: block; position: relative;}
.pic_block img {width: 100%;}
.pic_block b {
position: absolute;
bottom: 5px;
width: calc(100% - 20px);
margin: 0 !important;
padding: 10px;
background: rgba(0, 0, 0, 0.6);
opacity: 0;
transition: all 0.6s;
-webkit-transition: all 0.6s;
color: #fff;
}
.pic_block:hover > b {opacity: 1; color: #fff;}



.s-tabs .innertab {display: none; margin: 10px;}
.s-tabs .innertab.show {display: block;}


img.spoiler {
max-width: 40%;
display: inline-block;
border: 2px solid transparent;
opacity: 0.6;
transition: all 0.3s;
-webkit-transition: all 0.3s;
cursor: pointer;
}
img.spoiler:hover {opacity: 1;}
img.spoiler.selected {border: 2px solid #fff; opacity: 1;}

.sami {  
    filter: alpha (Opacity=75);
filter: grayscale(1);
    opacity: 0.15;
    -moz-transition: all 0.3s ease-in-out; 
    -webkit-transition: all 0.3s ease-in-out; 
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.sami:hover {
    filter: alpha (Opacity=100);
filter: grayscale(0);
    opacity: 1;
}

это в объяву:

Код:
<!-- Табличка в объявлении © ForumD.ru, Герда -->
<ul class="s-tabs">

<span>Мир</span>
<span>Новости</span>

        <li class="stab"><!-- начало первой вкладки -->


     <div id="s-block"><!-- блок -->
   <div id="left"><!-- слева -->

<h3><img src="https://i.ibb.co/nMbyBcB/image.png">Гостям</h3>
<a class="link" href="http://karatada.rolka.su/viewtopic.php?id=123">Правила  </a>
<a class="link" href="http://karatada.rolka.su/pages/putevoditel">Путеводитель  </a>
<a class="link" href="http://karatada.rolka.su/viewtopic.php?id=396">Розыск  </a>
<a class="link" href="http://karatada.rolka.su/viewtopic.php?id=456">Гостевая</a>
<a class="link" href="http://karatada.rolka.su/viewtopic.php?id=117">Шаблон анкеты</a>
<a class="link" href="http://karatada.rolka.su/viewtopic.php?id=146">FAQ</a>

   <!-- слева: конец --></div>
   <div id="center" class="pic"><!-- по центру -->

<div id="menu">
<div class="spll"><div class="splLink">Навигация</div>
<div class="splCont">
<a href="http://karatada.rolka.su/pages/cyclopedia">Энциклопедия</a><br>
<a href="http://karatada.rolka.su/pages/races">Расы</a><br>
<a href="http://karatada.rolka.su/pages/map">Карта мира</a><br>
<a href="http://karatada.rolka.su/pages/fractions">Фракции</a><br>
<a href="http://karatada.rolka.su/pages/luni">Луны</a><br>
<a href="http://karatada.rolka.su/pages/gods">Боги</a><br>
<a href="http://karatada.rolka.su/pages/components">Компоненты</a><br>
</div></div>
<div class="spll"><div class="splLink">Механика</div>
<div class="splCont">
<a href="http://karatada.rolka.su/pages/gamemechanic">Игровая система</a><br>
<a href="http://karatada.rolka.su/pages/gameskills">Навыки</a><br>
<a href="http://karatada.rolka.su/pages/aspects">Способности и слабости</a><br>
</div></div>
<div class="spll"><div class="splLink">Игра</div>
<div class="splCont">
<a href="http://karatada.rolka.su/viewtopic.php?id=337">Покупка навыков</a><br>
<a href="http://karatada.rolka.su/viewtopic.php?id=370">Продажа писанины</a><br>
<a href="http://karatada.rolka.su/viewtopic.php?id=475">Государства и земли</a><br>
<a href="http://karatada.rolka.su/viewtopic.php?id=473">Бестиарий</a><br>
<a href="http://karatada.rolka.su/viewtopic.php?id=477">Контролируемая магия</a><br>
<a href="http://karatada.rolka.su/viewforum.php?id=96">Библиотека</a><br>
</div></div>
</div>

<a href="http://karatada.rolka.su/pages/cyclopedia" class="pic_block">
<b>Описание картинки</b>
<img src="https://i.ibb.co/6v8JRg9/tumblr-pxc7w6-NJE71x61ieeo5-540.gif"></a>


   <!-- по центру: конец --></div>
   <div id="right"><!-- справа -->

<h3>Игрокам</h3>
<a class="link" href="http://karatada.rolka.su/pages/cyclopedia">Энциклопедия</a>
<a class="link" href="http://karatada.rolka.su/pages/gamemechanic">Игровая механика</a>
<a class="link" href="http://karatada.rolka.su/viewtopic.php?id=496#p7334">Бросить кубики</a>
<a class="link" href="http://karatada.rolka.su/pages/zatovari">Бакалея</a>

   <!-- справа: конец --></div>
     <!-- блок: конец --></div>
        <!-- конец первой вкладки --></li>

        <li class="stab"><!-- начало второй вкладки -->

     <div id="s-block"><!-- блок -->
   <div id="left"><!-- слева -->

<h3>Розыск</h3>

<a href="#" class="sami-icon">
<i>Описание иконки</i>
<img src="https://i.ibb.co/nr23Kr1/Arcane-Brilliance.png" class="sami">
</a>
<a href="#" class="sami-icon">
<i>Описание иконки</i>
<img src="https://i.ibb.co/nr23Kr1/Arcane-Brilliance.png" class="sami">
</a>
<a href="#" class="sami-icon">
<i>Описание иконки</i>
<img src="https://i.ibb.co/nr23Kr1/Arcane-Brilliance.png" class="sami">
</a>

   <!-- слева: конец --></div>
   <div id="center" class="news"><!-- по центру -->

<b><img src="https://i.ibb.co/wsP9KRd/image.png">Если накапливаются уведомления на иконке форума: Профиль -&gt; Редактировать -&gt; Уведомления, просто любуетесь историей и выходите... магия!</b>
<b><img src="https://i.ibb.co/wsP9KRd/image.png">В Кротову Лавку (бакалея) завезли новый товар! Поспешите, все предметы - в единственном экземпляре.</b>
<b><img src="https://i.ibb.co/wsP9KRd/image.png">Если видите несостыковки в темах и описаниях локаций - вызывайте Гейм Мастера!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">У навыка «Добыча» обновлена иконка, замените в своих карточках для корректного отображения.</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru"><a href="http://karatada.rolka.su/pages/races">Каталог рас</a> пополнился новыми обитателями Каратады - Проклятыми. Не живые, но и не мертвые, кто они на самом деле?</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Подведены итоги <a href="http://karatada.rolka.su/viewtopic.php?id=471#p6810">конкурса</a>. Благодарим за участие!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Ловец Снов <a href="http://karatada.rolka.su/viewtopic.php?id=472#p5939">прибыл</a> в преддверии Ночи Кошмаров. Он готов купить все ваши самые жуткие воспоминания и  сны!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Список <a href="http://karatada.rolka.su/pages/aspects">слабостей</a> пополнен множеством новых изъянов, которыми может обладать персонаж!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Создан <a href="http://karatada.rolka.su/viewtopic.php?id=472#p5939">опрос</a> по проведению мероприятия в честь Хэллоуина. Не забудьте поучаствовать!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">«Фантасмагория» была расширена, а ролевая переведена на локационно-эпизодическую (смешанную) систему. По всем вопросам обращайтесь к ГМ!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Анкеты игроков с отсутствием активности более месяца перемещены в Архив. Если вы вернулись и потеряли анкету - обращайтесь к ГМу, мы все сохранили.</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Мир - Хроники, были добавлены исторические хроники игрового мира. Если будут дополнения - пишите!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Некоторые темы из «Предисловия» были перенесены в новый раздел - «Бюро Авантюристов», доступный игрокам, которые уже приняты в игру. Все ссылки в быстром доступе работают без изменений.</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru"> Друзья, у нас наконец-то появились темы для рекламы! Вы знаете, что нужно делать. Я верю в вас.</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru">Доступен новый раздел <a href="http://karatada.rolka.su/pages/components">Компонентов</a> для ремесленных профессий, который со временем будет дополняться. Кожи пока нет.</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru"><a href="http://karatada.rolka.su/viewtopic.php?id=370">Тетушка Яг</a> всерьез увлеклась ремеслом, а потому скупает описания компонентов и материалов со всех уголков мира!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru"> Отныне все желающие могут продать статейку-другую редакции «Сплетницы» через <a href="http://karatada.rolka.su/viewtopic.php?id=370">тетушку Яг</a> . Пусть целый мир узнает о ваших приключениях... и их последствиях!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru"> Теперь поиск соигрока стал удобнее - шаблон в <a href="http://karatada.rolka.su/viewtopic.php?id=396">Розыске</a> поможет вам в этом нелегком деле!</b> 
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/3/38/%D0%A2%D1%8B%D0%BA%D0%B2%D0%B0.png/revision/latest?cb=20160618194250&amp;path-prefix=ru"> Ребята! Снова доступна <a href="http://karatada.rolka.su/pages/zatovari">Бакалея</a>, хотя с не доведенными до ума магазинами. Есть поле для творчества - дерзайте. Удачи!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/7/76/%D0%9F%D1%80%D0%BE%D0%BA%D0%BB%D1%8F%D1%82%D0%B0%D1%8F_%D0%BF%D1%83%D0%BB%D1%8F.png/revision/latest?cb=20120811100333&amp;path-prefix=ru">Список способностей и слабостей переменится, так что Вы пока туда не смотрите.</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/7/76/%D0%9F%D1%80%D0%BE%D0%BA%D0%BB%D1%8F%D1%82%D0%B0%D1%8F_%D0%BF%D1%83%D0%BB%D1%8F.png/revision/latest?cb=20120811100333&amp;path-prefix=ru"><a href="http://karatada.rolka.su/viewtopic.php?pid=3413#p3413">Мана</a> теперь не нужна.</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/7/76/%D0%9F%D1%80%D0%BE%D0%BA%D0%BB%D1%8F%D1%82%D0%B0%D1%8F_%D0%BF%D1%83%D0%BB%D1%8F.png/revision/latest?cb=20120811100333&amp;path-prefix=ru">Мастеринг в игре  давно стался пассивным! Но Вы пишите мне!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/7/76/%D0%9F%D1%80%D0%BE%D0%BA%D0%BB%D1%8F%D1%82%D0%B0%D1%8F_%D0%BF%D1%83%D0%BB%D1%8F.png/revision/latest?cb=20120811100333&amp;path-prefix=ru">До конца месяца игромеханика снова переменится, так что ничему не верьте. Особенно - магам!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/7/76/%D0%9F%D1%80%D0%BE%D0%BA%D0%BB%D1%8F%D1%82%D0%B0%D1%8F_%D0%BF%D1%83%D0%BB%D1%8F.png/revision/latest?cb=20120811100333&amp;path-prefix=ru">Мастеринг в игре  давно стался пассивным! Но Вы пишите мне!</b>
<b><img src="https://vignette.wikia.nocookie.net/terraria/images/7/76/%D0%9F%D1%80%D0%BE%D0%BA%D0%BB%D1%8F%D1%82%D0%B0%D1%8F_%D0%BF%D1%83%D0%BB%D1%8F.png/revision/latest?cb=20120811100333&amp;path-prefix=ru">Теперь посты можно оценивать жирным плюсом.</b>

   <!-- по центру: конец --></div>
   <div id="right"><!-- справа -->

<h3>Новые авантюристы</h3>

<a href="#" class="sami-icon">
<i>Описание иконки</i>
<img src="https://i.ibb.co/nr23Kr1/Arcane-Brilliance.png" class="sami">
</a>
<a href="#" class="sami-icon">
<i>Описание иконки</i>
<img src="https://i.ibb.co/nr23Kr1/Arcane-Brilliance.png" class="sami">
</a>
<a href="#" class="sami-icon">
<i>Описание иконки</i>
<img src="https://i.ibb.co/nr23Kr1/Arcane-Brilliance.png" class="sami">
</a>

   <!-- справа: конец --></div>
     <!-- блок: конец --></div>


<img src="https://i.ibb.co/LZWGNvD/lok-0004-12.jpg" class="spoiler">
<div class="innertab"><!-- что творится: начало -->

что творится

<!-- что творится: конец --></div>

<img src="https://i.ibb.co/crzrm2p/lok-0018-1.jpg" class="spoiler">
<div class="innertab"><!-- хроники мира: начало -->

хроники мира

<!-- хроники мира: конец --></div>

<img src="https://i.ibb.co/bzcycmr/lok-0013-7.jpg" class="spoiler">
<div class="innertab"><!-- сплетница: начало -->

сплетница

<!-- сплетница: конец --></div>

<img src="https://i.ibb.co/HzyC5bb/lok-0015-4.jpg" class="spoiler">
<div class="innertab"><!-- игровые события: начало -->

игровые события

<!-- игровые события: конец --></div>



        <!-- конец второй вкладки --></li>
</ul>



<script type="text/javascript">
$('.s-tabs').each(function(){
   $(this).children('span:first').addClass('selected');
   $(this).children('.stab').eq(0).show();   
});
$('.s-tabs>span').live('click', function(){
     var a = $(this).parent('.s-tabs');
     var arr = a.children('span');
     var index = arr.index(this);
     arr.removeClass('selected');
     $(this).addClass('selected');
     a.children('.stab').hide();   
     a.children('.stab').eq(index).show();   
});


$('.stab>.spoiler').live('click', function(){
     var a = $(this).parent('.stab');
     var arr = a.children('.spoiler');
     var index = arr.index(this);
     $(this).toggleClass('selected');
     a.children('.innertab').eq(index).toggleClass('show');
});

$('.splLink').click(function(){
   $(this).parent().children('div.splCont').toggle('normal');
    return false;
});
</script>

как работают вкладки

<ul class="s-tabs">

<span>Мир</span>
<span>Новости</span>

        <li class="stab"><!-- начало первой вкладки -->
сюда контент вкладки
        <!-- конец первой вкладки --></li>

        <li class="stab"><!-- начало второй вкладки -->
сюда контент вкладки
        <!-- конец второй вкладки --></li>
</ul>

Красное - названия, теперь они текстовые, чтоб добавить новую вкладку просто достаточно добавить <span>название</span> в том порядке, в котором оно должно отображаться

Синее - теги для начала и конца вкладки.
если нужна будет еще одна, добавляем:

Код:
        <li class="stab">
тут контент
        </li>

в каком порядке идет вкладки - в таком же порядке они "привязываются" к красным пунктам меню.

Контент
Внутри вкладок вот такие блоки отвечают за "таблицу":

Код:
     <div id="s-block"><!-- блок -->
   <div id="left"><!-- слева -->

контент слева

   <!-- слева: конец --></div>
   <div id="center" class="pic"><!-- по центру -->

контент по центру


   <!-- по центру: конец --></div>
   <div id="right"><!-- справа -->

контент справа

   <!-- справа: конец --></div>
     <!-- блок: конец --></div>

Если добавлять вот такую конструкцию внутрь вкладок - будет три ячейки.
если без нее, то будет просто текст (по центру)

Чтобы сделать заголовок ставим теги:

<h3><img src="https://i.ibb.co/nMbyBcB/image.png">Гостям</h3>

если вставить картинку, она автоматически "сожмется" до нужного размера и сделает отступ от текста

чтобы вставить пункт меню (как в блоках "гостям" или "игрокам"):

<a class="link" href="http://karatada.rolka.su/viewtopic.php?id=123">Правила</a>

class="link" отвечает за то, чтобы ссылка имела нужный стиль. тегов переноса <br> рядом с такими ссылками не нужно - они сами переносятся на новую строку.

Новость добавляется кодом:

<b><img src="https://i.ibb.co/wsP9KRd/image.png">Если накапливаются уведомления на иконке форума: Профиль - Редактировать - Уведомления, просто любуетесь историей и выходите... магия!</b>

теги <b></b> отвечают за стиль новости, весь текст надо вставлять внутри них.
если вставить картинку, она автоматически "сожмется" до нужного размера и сделает отступ от текста
тегов переноса <br> досле новости не нужны - они сами переносятся на новую строку.

Картинки-спойлеры:

<img src="https://i.ibb.co/LZWGNvD/lok-0004-12.jpg" class="spoiler">
<div class="innertab"><!-- что творится: начало -->

что творится

<!-- что творится: конец --></div>

красное - ссылка на картинку
картинка автоматически сжимается до 40% от ширины таблички в встает по центру.
синее - текст

+1

28

Герда, большое спасибо! Все очень понятно, табличка замечательная <3
Прошу прощения за доставленные в процессе неприятности, я постараюсь четче формулировать свое "что надо" в следующий раз, благодарю за терпение.

+1

29

Helheima
без проблем. оставлю топик открытым. если будут какие-нибудь правки, проблемы - обращайся

0

30

Герда написал(а):

Helheima
без проблем. оставлю топик открытым. если будут какие-нибудь правки, проблемы - обращайся

Хорошо, спасибо! Я вышлю ссылку как поставлю у нас, хочу завезти с зимним дизайном сразу :3

0

Быстрый ответ

Напишите ваше сообщение и нажмите «Отправить»


ВНИМАНИЕ! При обращении за техподдержкой и вопросами по скриптам/оформлению, оставляйте ссылку на форум/сайт с проблемой! Специалист должен вживую видеть проблему, чтобы подсказать как ее решить.

ВНИМАНИЕ! Гости (не зарегистрированные на форуме) могут писать сообщения, но не могут вставлять прямые ссылки! Чтобы оставить сообщение со ссылкой на сайт, форум или скриншот удалите символы: "http://", "https://" или "www."


Вы здесь » ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка » Верстка и скрипты » (БЕСПЛАТНО) / Кодинг: объявления. Таблица шапки