LBM
User-
Posts
53 -
Joined
-
Last visited
About LBM
- Birthday 03/25/1991
Information
-
Sex
Мужчина
-
From
Минск
-
Interests
Архитектура, фото, дизайн, SEO, сайтостроительство.
Contacts
-
Web site
http://chocolate-kiss.ru/
LBM's Achievements
Explorer (1/14)
0
Reputation
-
Купил премиум тему. Затем установил на нее два необходимых плагина - слайдер и видеогалереи. Сразу видны проблемы. Я не програмист, к сожалению ( Их две. На статических страницах некорректно стал работать слайдер (корректно работает на главной), пропали стрелки и выводятся названия картинок. http://yadi.sk/d/jyAAIMu1P9UPZ - скрин глюков слайдера Вторая проблема, перестают работать выпадающие пункты главного (вверху) меню. Плагины создающие проблемы: royalslider и rio videogallery Ах да, сайт http://chocolate-kiss.ru/
-
Оказывается меню не работает изза включенного плагина Rio Video Gallery - http://riosis.com/themes/rio-video-gallery/ Видимо конфликт CSS ?
-
Это у меня на сайте такая конструкция?
-
Купил премиум шаблон для wordpress. и тут беда, не выпадают дочерние пункты меню в теме. Написал автору шаблона и до сих пор не дождался ответа. Ребята, гляньте - http://new.chocolate-kiss.ru/ , может хоть подскажите в какую сторону капать....
-
title теперь отображается, но часто вылазит за края (речь про задачу номер 2). Паддинг отодвигает title картинок только по левому краю, справа все равно вылазит, хотя значение задаю по обоим бокам.
-
Это помогло! Спасибо большое!
-
Да. Title картинок. П.с. как освобожусь, сяду попробую Ваши варианты. А пока, спасибо большое, что откликнулись! Хорошо, попробую освоить этот сервис.
-
Задача номер два. Главная страница - test.chocolate-kiss.ru На ней располагается сетка рецептов с ссылками на записи. Эти картинки - миниатюры Wordpress. Задача - при наведении курсора должна всплывать подсказка (title) в виде полупрозрачного фона с радиусом (по сути круг), поверх самой картинки. Сейчас же этот радиус криво, но всплывает, правда в сторонке от картинки. Как его привязать к картинке точно? Вот CSS сейчас: .search-img {overflow:hidden; padding:0px; margin:0 1px 1px 0; float:left; width:150px; height:150px; background:#000; font-size:14px; font-weight:normal; text-align:center;line-height:2em; -moz-border-radius: 75px; /* Для Firefox 3 */ -webkit-border-radius: 75px; /* Для Safari 4 и Chrome */ border-radius: 75px; /* Радиус скругления */ } .search-img:hover::after { width:150px; height:150px; -moz-border-radius: 75px; /* Для Firefox 3 */ -webkit-border-radius: 75px; /* Для Safari 4 и Chrome */ border-radius: 75px; /* Радиус скругления */ content: attr(data-title); /* Выводим текст */ position: absolute; /* Позиционирование */ z-index: 1; /* Отображаем подсказку поверх других элементов */ background: rgba(0,42,167,0.6); /* Полупрозрачный цвет фона */ color: #fff; /* Цвет текста */ text-align: center; /* Выравнивание текста по центру */ font-family: Arial, sans-serif; /* Гарнитура шрифта */ font-size: 11px; /* Размер текста подсказки */ padding: 5px 10px; /* Поля */ border: 1px solid #333; /* Параметры рамки */ } Задача номе три. По сути это часть второй задачи. Дело в том, что в Опере картинки ни в какую не хотят отображаться круглыми.
-
Есть тестовый сайтик один. Задача номер 1 - корректное отображение паспорту у картинок с выводом заголовка title в этом же паспорту. Пример по адресу - test.chocolate-kiss.ru/tvorozhnye-oladi-s-yablokami Особенно криво съезжает паспорту вправо в Опере. В Хроме справа отступ больше, чем слева у паспорту. Вот код, который отвечает сейчас за это дело: /* Captions */.aligncenter,div.aligncenter{display:block;margin-left:auto;margin-right:auto} .wp-caption{ padding: 20px; /* Ширина паспарту */ background: #f0f0f0; /* Цвет фона паспарту */ } .wp-caption img{ padding: 20px; /* Ширина паспарту */ background: #f0f0f0; /* Цвет фона паспарту */ } .wp-caption p.wp-caption-text{font-size:13px;color:#4f2c2c;line-height:15px;padding:0 30px 5px;margin:0;} /* End captions */ Не проходите мимо пожалуйста! А то я уже голову поломал )
-
http://forum.htmlbook.ru/index.php?showtopic=34618 поможете?
-
Вот сайт: tutbuch.by, что то я перемудрил, не могу никак подвал снизу приделать. Помогите! Очень надо. Могу скинуть денежки за это, только напишите сколько. html, body { background: #f1f1f1; height: 100%; width: 100%; margin: 0px; padding: 0px; } p, ul, li{ font-family: 'Times New Roman', Times, serif; /* Шрифт с засечками */ font-size: 13pt; /* Размер шрифта в пунктах */ margin-top: 0.3em; /* Отступ сверху */ margin-bottom: 0.3em; /* Отступ снизу */ } a:link,a:visited{color:#000000} ul.menu { margin-right: 50px; padding: 4px; /* Значение полей */ text-transform: uppercase; /* Заглавные буквы */ font-size: 15pt; /* Размер шрифта в пунктах */ color: #fff; /* Цвет символа */ } ul.menu li { display: inline; /* Отображать как строчный элемент */ margin-right: 5px; /* Отступ слева */ padding: 3px; /* Поля вокруг текста */ text-transform: uppercase; /* Заглавные буквы */ font-size: 14pt; /* Размер шрифта в пунктах */ color: #fff; /* Цвет символа */ } ul.menu a { text-decoration:none; color: #fff; /* Цвет символа */ } h1, h2, h3, h4, h5, h6{ font-family: 'Times New Roman', Times, serif; /* Шрифт с засечками */ font-size: 14pt; /* Размер шрифта в пунктах */ margin-top: 0.3em; /* Отступ сверху */ margin-bottom: 0.3em; /* Отступ снизу */ margin-left: 2em; /* Отступ снизу */ } #site { position: relative; min-height: 100%; margin-bottom: 50px; } * html #site { height: 100%; } #green { position: absolute; /* Абсолютное позиционирование */ width: 100%; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ top: 0%; /* Положение слоя от верхнего края */ margin-top: -0px; /* Отступ сверху */ background-image: url(http://tutbuch.by/images/bg.jpg); /* Путь к фоновому изображению */ background-repeat: repeat-x; /* Повторяем фон по горизонтали */ z-index: 1; } #head { position: absolute; /* Абсолютное позиционирование */ width: 1572px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 50%; /* Положение слоя от левого края */ top: 0%; /* Положение слоя от верхнего края */ margin-left: -786px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ z-index: 2; } #head1{ position: absolute; /* Абсолютное позиционирование */ width: 274px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_01.jpg); /* Путь к фоновому изображению */ z-index: 3; } #head2{ position: absolute; /* Абсолютное позиционирование */ width: 1024px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 274px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_02.jpg); /* Путь к фоновому изображению */ z-index: 3; } #head3{ position: absolute; /* Абсолютное позиционирование */ width: 274px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 1298px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_03.jpg); /* Путь к фоновому изображению */ z-index: 3; } #moby{ position: absolute; /* Абсолютное позиционирование */ width: 100%; /* Ширина слоя в пикселах */ height: 100px; /* Высота слоя в пикселах */ right: 70px; /* Положение слоя от левого края */ top: 139px; /* Положение слоя от верхнего края */ text-align: right; z-index: 4; } #menu{ position: absolute; /* Абсолютное позиционирование */ width: 100%; /* Ширина слоя в пикселах */ height: 50px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 239px; /* Положение слоя от верхнего края */ text-align: right; z-index: 4; } #content{ position: absolute; /* Абсолютное позиционирование */ width: 1030px; /* Ширина слоя в пикселах */ left: 50%; /* Положение слоя от левого края */ top: 289px; /* Положение слоя от верхнего края */ margin-left: -515px; /* Отступ слева */ background: #f1f1f1; /* Цвет фона */ z-index: 4; margin-bottom: 50px; } #back1{ position: absolute; /* Абсолютное позиционирование */ width: 154px; /* Ширина слоя в пикселах */ height:28px; left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_04.jpg); /* Путь к фоновому изображению */ background-position: right top; /* Положение фона */ background-repeat: no-repeat; z-index: 3; } #center{ position: absolute; /* Абсолютное позиционирование */ width: 722px; /* Ширина слоя в пикселах */ left: 154px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 3; } #back2{ position: absolute; /* Абсолютное позиционирование */ width: 154px; /* Ширина слоя в пикселах */ left: 876px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 3; } #menu2{ position: absolute; /* Абсолютное позиционирование */ width: 722px; /* Ширина слоя в пикселах */ height: 250px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 4; } #text{ position: absolute; /* Абсолютное позиционирование */ width: 500px; /* Ширина слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 280px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ margin-bottom: 50px; background: #f1f1f1; /* Цвет фона */ padding: 5px; /* Поля вокруг текста */ z-index: 5; } #sidebar{ position: absolute; /* Абсолютное позиционирование */ width: 222px; /* Ширина слоя в пикселах */ left: 500px; /* Положение слоя от левого края */ top: 280px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ padding: 5px; /* Поля вокруг текста */ z-index: 4; } #footer{ width: 100%; /* Ширина слоя в пикселах */ clear: both; position: fixed; /* Фиксированное положение */ z-index: 10; height: 30px; margin-top: -30px; background: #424242; /* Цвет фона */ } <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Ведение бухгалтерского и налогового учета белорусских и российских предприятий</title> <link href="http://tutbuch.by/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="site"> <div id="green"> <div id="head"> <div id="head1"> </div> <div id="head2"> <div id="moby"> <?php include 'in/moby.html'; ?> </div> <div id="menu"> <?php include 'in/menu.html'; ?> </div> </div> <div id="head3"> </div> </div> </div> <div id="content"> <div id="back1"> </div> <div id="center"> <div id="menu2"> <?php include 'in/menu2.html'; ?> </div> <div id="text"> </div> <div id="sidebar"> <?php include 'in/sidebar.html'; ?> </div> </div> <div id="back2"> </div> </div> </div> <div id="footer"> вмымывм </div> </td> </tr> </table> </body> </html>
-
Намучился уже... ничего не выходит, перепробывал все варианты из ТОП 10 Гугла Надо просто поместить подвал внизу страницы. Помогите! Могу отблагодарить за рабочий вариант <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Ведение бухгалтерского и налогового учета белорусских и российских предприятий</title> <link href="http://tutbuch.by/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="site"> <div id="green"> <div id="head"> <div id="head1"> </div> <div id="head2"> <div id="menu"> </div> </div> <div id="head3"> </div> </div> </div> <div id="content"> <div id="back1"> </div> <div id="center"> <div id="menu2"> </div> <div id="text"> </div> <div id="sidebar"> </div> </div> <div id="back2"> </div> </div> </div> <div id="footer"> Подвал </div> </body> </html> html, body { background: #f1f1f1; height: 100%; width: 100%; margin: 0px; padding: 0px; } p, ul, li{ font-family: 'Times New Roman', Times, serif; /* Шрифт с засечками */ font-size: 11pt; /* Размер шрифта в пунктах */ margin-top: 0.3em; /* Отступ сверху */ margin-bottom: 0.3em; /* Отступ снизу */ } ul.menu { margin-right: 50px; padding: 4px; /* Значение полей */ text-transform: uppercase; /* Заглавные буквы */ font-size: 15pt; /* Размер шрифта в пунктах */ color: #fff; /* Цвет символа */ } ul.menu li { display: inline; /* Отображать как строчный элемент */ margin-right: 5px; /* Отступ слева */ padding: 3px; /* Поля вокруг текста */ text-transform: uppercase; /* Заглавные буквы */ font-size: 14pt; /* Размер шрифта в пунктах */ color: #fff; /* Цвет символа */ } h1, h2, h3, h4, h5, h6{ font-family: 'Times New Roman', Times, serif; /* Шрифт с засечками */ font-size: 14pt; /* Размер шрифта в пунктах */ margin-top: 0.3em; /* Отступ сверху */ margin-bottom: 0.3em; /* Отступ снизу */ margin-left: 2em; /* Отступ снизу */ } #site { position: relative; min-height: 100%; } * html #site { height: 100%; } #green { position: absolute; /* Абсолютное позиционирование */ width: 100%; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ top: 0%; /* Положение слоя от верхнего края */ margin-top: -0px; /* Отступ сверху */ background-image: url(http://tutbuch.by/images/bg.jpg); /* Путь к фоновому изображению */ background-repeat: repeat-x; /* Повторяем фон по горизонтали */ z-index: 1; } #head { position: absolute; /* Абсолютное позиционирование */ width: 1572px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 50%; /* Положение слоя от левого края */ top: 0%; /* Положение слоя от верхнего края */ margin-left: -786px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ z-index: 2; } #head1{ position: absolute; /* Абсолютное позиционирование */ width: 274px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_01.jpg); /* Путь к фоновому изображению */ z-index: 3; } #head2{ position: absolute; /* Абсолютное позиционирование */ width: 1024px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 274px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_02.jpg); /* Путь к фоновому изображению */ z-index: 3; } #head3{ position: absolute; /* Абсолютное позиционирование */ width: 274px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 1298px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_03.jpg); /* Путь к фоновому изображению */ z-index: 3; } #menu{ position: absolute; /* Абсолютное позиционирование */ width: 100%; /* Ширина слоя в пикселах */ height: 50px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 239px; /* Положение слоя от верхнего края */ text-align: right; z-index: 4; } #content{ position: absolute; /* Абсолютное позиционирование */ width: 1030px; /* Ширина слоя в пикселах */ left: 50%; /* Положение слоя от левого края */ top: 289px; /* Положение слоя от верхнего края */ margin-left: -515px; /* Отступ слева */ background: #f1f1f1; /* Цвет фона */ z-index: 4; } #back1{ position: absolute; /* Абсолютное позиционирование */ width: 154px; /* Ширина слоя в пикселах */ height:28px; left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_04.jpg); /* Путь к фоновому изображению */ background-position: right top; /* Положение фона */ background-repeat: no-repeat; z-index: 3; } #center{ position: absolute; /* Абсолютное позиционирование */ width: 722px; /* Ширина слоя в пикселах */ left: 154px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 3; } #back2{ position: absolute; /* Абсолютное позиционирование */ width: 154px; /* Ширина слоя в пикселах */ left: 876px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 3; } #menu2{ position: absolute; /* Абсолютное позиционирование */ width: 722px; /* Ширина слоя в пикселах */ height: 193px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 4; } #text{ position: absolute; /* Абсолютное позиционирование */ width: 500px; /* Ширина слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 193px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ padding: 5px; /* Поля вокруг текста */ z-index: 5; } #sidebar{ position: absolute; /* Абсолютное позиционирование */ width: 222px; /* Ширина слоя в пикселах */ left: 500px; /* Положение слоя от левого края */ top: 193px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ padding: 5px; /* Поля вокруг текста */ z-index: 4; } #footer{ clear: both; position: relative; z-index: 10; height: 70px; margin-top: -70px; }
-
Намучился уже... ничего не выходит, перепробывал все варианты из ТОП 10 Гугла Надо просто поместить подвал внизу страницы. Помогите! Могу отблагодарить за рабочий вариант <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Ведение бухгалтерского и налогового учета белорусских и российских предприятий</title> <link href="http://tutbuch.by/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="site"> <div id="green"> <div id="head"> <div id="head1"> </div> <div id="head2"> <div id="menu"> </div> </div> <div id="head3"> </div> </div> </div> <div id="content"> <div id="back1"> </div> <div id="center"> <div id="menu2"> </div> <div id="text"> </div> <div id="sidebar"> </div> </div> <div id="back2"> </div> </div> </div> <div id="footer"> Подвал </div> </body> </html> html, body { background: #f1f1f1; height: 100%; width: 100%; margin: 0px; padding: 0px; } p, ul, li{ font-family: 'Times New Roman', Times, serif; /* Шрифт с засечками */ font-size: 11pt; /* Размер шрифта в пунктах */ margin-top: 0.3em; /* Отступ сверху */ margin-bottom: 0.3em; /* Отступ снизу */ } ul.menu { margin-right: 50px; padding: 4px; /* Значение полей */ text-transform: uppercase; /* Заглавные буквы */ font-size: 15pt; /* Размер шрифта в пунктах */ color: #fff; /* Цвет символа */ } ul.menu li { display: inline; /* Отображать как строчный элемент */ margin-right: 5px; /* Отступ слева */ padding: 3px; /* Поля вокруг текста */ text-transform: uppercase; /* Заглавные буквы */ font-size: 14pt; /* Размер шрифта в пунктах */ color: #fff; /* Цвет символа */ } h1, h2, h3, h4, h5, h6{ font-family: 'Times New Roman', Times, serif; /* Шрифт с засечками */ font-size: 14pt; /* Размер шрифта в пунктах */ margin-top: 0.3em; /* Отступ сверху */ margin-bottom: 0.3em; /* Отступ снизу */ margin-left: 2em; /* Отступ снизу */ } #site { position: relative; min-height: 100%; } * html #site { height: 100%; } #green { position: absolute; /* Абсолютное позиционирование */ width: 100%; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ top: 0%; /* Положение слоя от верхнего края */ margin-top: -0px; /* Отступ сверху */ background-image: url(http://tutbuch.by/images/bg.jpg); /* Путь к фоновому изображению */ background-repeat: repeat-x; /* Повторяем фон по горизонтали */ z-index: 1; } #head { position: absolute; /* Абсолютное позиционирование */ width: 1572px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 50%; /* Положение слоя от левого края */ top: 0%; /* Положение слоя от верхнего края */ margin-left: -786px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ z-index: 2; } #head1{ position: absolute; /* Абсолютное позиционирование */ width: 274px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_01.jpg); /* Путь к фоновому изображению */ z-index: 3; } #head2{ position: absolute; /* Абсолютное позиционирование */ width: 1024px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 274px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_02.jpg); /* Путь к фоновому изображению */ z-index: 3; } #head3{ position: absolute; /* Абсолютное позиционирование */ width: 274px; /* Ширина слоя в пикселах */ height: 289px; /* Высота слоя в пикселах */ left: 1298px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #85aa39; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_03.jpg); /* Путь к фоновому изображению */ z-index: 3; } #menu{ position: absolute; /* Абсолютное позиционирование */ width: 100%; /* Ширина слоя в пикселах */ height: 50px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 239px; /* Положение слоя от верхнего края */ text-align: right; z-index: 4; } #content{ position: absolute; /* Абсолютное позиционирование */ width: 1030px; /* Ширина слоя в пикселах */ left: 50%; /* Положение слоя от левого края */ top: 289px; /* Положение слоя от верхнего края */ margin-left: -515px; /* Отступ слева */ background: #f1f1f1; /* Цвет фона */ z-index: 4; } #back1{ position: absolute; /* Абсолютное позиционирование */ width: 154px; /* Ширина слоя в пикселах */ height:28px; left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ background-image: url(http://tutbuch.by/images/buch_04.jpg); /* Путь к фоновому изображению */ background-position: right top; /* Положение фона */ background-repeat: no-repeat; z-index: 3; } #center{ position: absolute; /* Абсолютное позиционирование */ width: 722px; /* Ширина слоя в пикселах */ left: 154px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 3; } #back2{ position: absolute; /* Абсолютное позиционирование */ width: 154px; /* Ширина слоя в пикселах */ left: 876px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 3; } #menu2{ position: absolute; /* Абсолютное позиционирование */ width: 722px; /* Ширина слоя в пикселах */ height: 193px; /* Высота слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 0px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ z-index: 4; } #text{ position: absolute; /* Абсолютное позиционирование */ width: 500px; /* Ширина слоя в пикселах */ left: 0px; /* Положение слоя от левого края */ top: 193px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ padding: 5px; /* Поля вокруг текста */ z-index: 5; } #sidebar{ position: absolute; /* Абсолютное позиционирование */ width: 222px; /* Ширина слоя в пикселах */ left: 500px; /* Положение слоя от левого края */ top: 193px; /* Положение слоя от верхнего края */ margin-left: -0px; /* Отступ слева */ margin-top: -0px; /* Отступ сверху */ background: #f1f1f1; /* Цвет фона */ padding: 5px; /* Поля вокруг текста */ z-index: 4; } #footer{ clear: both; position: relative; z-index: 10; height: 70px; margin-top: -70px; }
-
Покопался в интернете, научился подключать шрифты. Но возникло несколько вопросов. Во-первых, нужно подключать два файла шрифта (один для мазилы, другой для оперы, к примеру) - это обязательно? Потому что встретил сервис от Гугла по подключению внешних шрифтов, там указывается только путь загрузки шрифта с сервера Гугл. На гугле тоже подразумевается два файла? Отсюда вытекает вопрос о времени загрузки. Так как тот шрифт, который я хочу весит 150 килобайт, а два файла соответственно 300 килобайт - много. Можно ли как то ужать вес шрифта? Хотел бы услышать разные советы по шрифтоподключению. Заранее благодарен.