Скажите, а что если нужные "сложные" страницы? К примеру, как в сайте -
фирма - инфо, акции; производство - такое и сякое, контакты - твои, мои, ничьи. То есть под страницы, как такое сделать?
Я думала как бы создать горизонтальное выпадающее меню на CSS для Blogger, чтобы оно было удобно неопытному пользователю, чтобы не нужно было погружаться в дебри кода для добавления ещё одной ссылки.
Стили для меню
Стили были выбраны нейтральные, но лучше их подогнать индивидульно для вашего шаблона, потому что не всем подходит, например, прозрачный фон или нужен небольшой отступ блока влево. Перед
]]></b:skin>добавляем
.skryt1 + span {display:none; position:relative;}
.skryt1:hover + span, .skryt1 + span:hover {
display:block;
position: absolute;
top: 70%;
padding: 10px;
z-index: 2000; }
.skryt1:hover + span > a, .skryt1 + span:hover > a {
display:block;
width: 100%;
padding: 10px;
background: transparent url(http://www.blogblog.com/1kt/travel/bg_black_70.png) repeat scroll top left;
border: 2px groove #444;
border-radius:3px; }
.tabs-outer { z-index: 1000; overflow: visible; }
.tabs-inner .widget li a { display: block; }
.tabs-inner .widget li { display: inline-block; }При использовании группы шаблонов "Веницианское окно" и "Легкость" с закруглёнными углами, нужно убрать свойство -goog-ms-border-radius из селектора .tabs-inner .widget li a и .tabs-inner .widget li:first-child a при их наличии. Приведу возможные варианты:
.tabs-inner .widget li a {
-goog-ms-border-top-left-radius: 5px;
-goog-ms-border-top-right-radius: 5px;
-goog-ms-border-radius: $(tab.border.radius) $(tab.border.radius) 0 0;}
.tabs-inner .widget li:first-child a {
-goog-ms-border-top-$startSide-radius: $(tab.first.border.radius);
-goog-ms-border-bottom-$startSide-radius: $(tabs.border.radius);}То есть удаляем из кода одну выделенную жирным строку
.tabs-inner .widget li a {
display: inline-block;
padding: .5em 1em;
margin-$endSide: $(tabs.spacing);
color: $(tabs.text.color);
font: $(tabs.font);
-moz-border-radius: $(tab.border.radius) $(tab.border.radius) 0 0;
-webkit-border-top-left-radius: $(tab.border.radius);
-webkit-border-top-right-radius: $(tab.border.radius);
-goog-ms-border-radius: $(tab.border.radius) $(tab.border.radius) 0 0;
border-radius: $(tab.border.radius) $(tab.border.radius) 0 0;
background: $(tab.background);
border-$endSide: 1px solid $(tabs.separator.color);
}Гаджет "Список"
Добавляем гаджет "Список" в пунктирное поле между заголовком и сообщением. Этот значок
позволяет слово сделать ссылкой на определённую вами страницу. Вспомним код ссылки.
В том случае, когда мы хотим, чтобы ссылка содержала выпадающие пункты подменю, в поле "Добавить элемент списка" вносим код.
<a href="адрес_для_Пункт" class="skryt1"> Пункт </a> <span><a href="адрес_для_Подпункт1">Подпункт1</a> <a href="адрес_для_Подпункт2">Подпункт2</a> ... <a href="адрес_для_ПодпунктN">ПодпунктN</a></span>
Похожие статьи:
Отправить комментарий