Добро пожаловать!
На нашем сайте вы найдете инструкции, которые помогут вам освоить систему uCoz и uWeb. Мы регулярно обновляем ресурс новыми инструкциями и обзорами. Благодаря нам вы поднимете свой начальный уровень знаний html&css, а также самой системы uCoz и uWeb до, как минимум, среднего уровня!
Мы всегда готовы помочь вам, и ответим на любые интересующие вас вопросы. Создайте отдельную тему с вашим вопросом в Вопросах по uCoz и uWeb и мы обязательно ответим на него.
| Вёрстка [0] |
| Настройка дизайна [4] Мелкие детали функций uCoz |
Дизайн #796 | 12 Май 2012 14:56
Дизайн #796 | 12 Май 2012 06:25
Дизайн #796 | 12 Май 2012 05:39
Дизайн #798 | 07 Май 2012 15:40
Дизайн #806 | 07 Май 2012 12:40
Поиск
Наш опрос
Статистика
Соединяем блоки (25 Ноя 2011)
В этой статье я расскажу вам о том, как "собрать" два контейнера в один, точнее, как соединить друг друга вместе. Ниже будет описываться соединение блоков на стандартном шаблоне #793.
Изображение #1 Итак, заходим в Панель управления » Управление дизайном » Конструктор шаблонов (http://вашсайт/panel/?a=tmaker), нажимаем на Каркасы стандартных дизайнов и выбираем наш шаблон #793 (можно и другой). Нас будет интересовать только следующая область кода: Между <!-- <middle> --> и <!-- </middle> --> находится то, где будут отображаться наши блоки и сам контент нашего сайта: форум, материалы и так далее. А между <!-- <container> --><!-- <block> --> и <!-- </block> --><!-- </container> --> - содержимое наших блоков. Все блоки будут находится слева, а контент справа. Приступим. Вот собственно код дизайн блоков, которые находятся слева: Code <td id="leftcol"> <!-- <container> --> <!-- <block> --> <div class="block"> <div class="blocktitle"> TITLE </div> <div class="blockcontent"> <div class="blockcontent_inside"> CONTENT </div> </div> <div class="blockbottom"></div> </div> <!-- </block> --> <!-- </container> --> </td> По сути нам нужно продублировать этот код, но это можно сделать короче, добавим после этого сразу только следующее: Code <td id="rightcol"> <!-- <container> --> <!-- </container> --> </td> Мы удалили всё, что было внутри container, т.к. дизайн блоков уже задан в предыдущем дизайне и изменим leftcol на rightcol. Теперь давайте найдем старый код и удалим его: Code <td id="rightcol"> <!-- <container> --> <!-- </container> --> </td> На данный момент у нас должно получиться следующим образом: Code <!-- <middle> --> <table border="0" cellspacing="0" cellpadding="0" width="960"> <tr> <td id="leftcol"> <!-- <container> --> <!-- <block> --> <div class="block"> <div class="blocktitle"> TITLE </div> <div class="blockcontent"> <div class="blockcontent_inside"> CONTENT </div> </div> <div class="blockbottom"></div> </div> <!-- </block> --> <!-- </container> --> </td> <td id="rightcol"> <!-- <container> --> <!-- </container> --> </td> <td id="maincol"> <div id="maincol_inside"> [BODY] </div> </td> </tr> </table> <!-- </middle> --> Теперь нам нужно найти строчку: Code <link href="http://s58.ucoz.net/src/css/793.css" rel="stylesheet" type="text/css" /> ВНИМАНИЕ!!! Чтобы совершать данное действие, вы должны быть уверены, что до этого установили данный шаблон (через Общие настройки). Заменим её на: Code <link href="/_st/my.css" rel="stylesheet" type="text/css" /> В результате у нас получается так: ![]() От автора: Дело в том, что дизайнов в интернете много, и не всегда проходит такой вариант соединения блоков, поэтому, сначала попробуйте сделать всё это по инструкции, а только потом уже обращайтесь к нам за помощью на форум. |
| Всего комментариев: 2 | |
![]() #1 TryTooKillme 26 Ноя 2011 У меня не получилось по вашему способу. Возможно через то что мой дизайн (797) отличается от этого но у меня получилось когда я просто поменял leftcol на rightcol единственное что плохо то между блоками нет промежутка. Ну с этим думаю я разберусь полазив в CSS если кто-то знает можете подсказать буду очень рад. #2 Nikita 26 Ноя 2011 Нужно между leftcol и rightcol установить отступ. Нужно к leftcol добавить: margin-right:10px; | |





