Помощник
|
Верстка CSS - вопросы по моему сайту |
Eugene-N
|
Сообщение
#1
|
||
|
|
||
|
|||
Muxa_hb |
10.5.2012, 22:14;
Ответить: Muxa_hb
Сообщение
#2
|
|
<html><body><div id="wrap"><div id="left">Левое меню</div><div id="content">Какой то контент</div><div id="right">Правое меню</div></div></body></html> [CSS]#wrap { width: 800px; margin: 0 auto; background-color: #0000FF; } #left { margin-top: 10px; float:left; width:150px; height: 200px; background-color: #00FF00; } #right { margin-top: 10px; float:right; width:150px; height: 200px; background-color: #FF0000; } #content { margin: 10px 155px 5px 155px; width: 500px; height: 200px; background-color: #FFFF66; }[/CSS] |
|
|
Muxa_hb |
10.5.2012, 22:17;
Ответить: Muxa_hb
Сообщение
#3
|
|
примерно так, например.. я их разукрасил разными цветами, чтоб понятнее было
|
|
|
Bugnet |
10.5.2012, 22:45;
Ответить: Bugnet
Сообщение
#4
|
|
Насколько я понял это можно сделать с помощью таблиц css, но я читал что таблицы сейчас лучше не использовать, так как все работают со стилями css, и это лучше и удобнее. Это у Вас абсурдная фраза. Правильнее будет приблизительно так: Раньше верстали на таблицах, а сейчас всё больше блочная вёрстка. А стили сss - это оформление, и ими оформляются как таблицы так и блоки. Теперь, что касается Ваших вопросов. Вы ведь сверстали сайт на дивах. Изначально всё представили как чистый прямоугольный лист (наверное, как-то так ) и распихали по нём влево-вправо-посредине свои дивы. Теперь каждый див представьте как такой-же прямоугольник и снова "распихайте" в нём внутри новые дивы, так как будто вы верстаете новый внутренний сайт. Внутри уже новых дивов можно вновь записывать дивы и так "пока пикселей хватит". Потому-то вы и увидели, что ....тег div повторяется 50 раз...
|
|
|
Eugene-N
|
Сообщение
#5
|
|
Bugnet - здравствуйте! Большое спасибо за подсказку - но пока не получается!
Вот например я хочу создать в правом меню дополнительный блок div html <div class="RightMenu"> </div class="RightMenu2"></div> <div> css .RightMenu { float: right; overflow: hidden; background: url(img/left.jpg); width: 180px; height: 800px; } .RightMenu2 { background: url(img/Peterburg.jpg); width: 80px; height: 40px; } картинка где то появляется (потому что сдвигаются поля - и сдвигаются поля нижнего поля, а не бокового), но ее не видно. Скажите пожалуйста 1) как задать ширину и высоту div 2) как его выровнять относительно того div в котором он уже находиться 3) как правильно поместить div в div - у меня же два файла - html и css, в html див помещается прямо в див? Как я сделал? Или там нужно какое то дополнительное форматирование - отступ или еще что то? А в css - там же свойства div идут один за другим - там нужно как-то соблюдать иерарархию? У меня сейчас в таком порядке .MainFrame .header .header2 .LeftMenu .RightMenu .RightMenu2 (это новый div который я пытаюсь сделать - но пока не работает) .WorkArea .footer .menu .menu:hover И еще такой вопрос - как нужно прописывать этот внутренний div - основные див-блоки заданы классами - например <div class="LeftMenu"> - это стандарт, т.е. программа понимает только класс - и для него уже есть свойства - или див это просто условный блок, а класс здесь для удобства верстки, чтобы не забыть - но тогда зачем слово class, можно было бы просто <div "LeftMenu"> Я спрашиваю потому что - может ошибка в названии внутренних блоков - как их правильно прописать? |
|
|
Eugene-N
|
Сообщение
#6
|
|
Я переформулирую вопрос. Если я правильно понимаю, мне нужно просто правильно организовать иерархию div-блоков и правильно указать в них параметры форматирования для текста и картинок. Выглядеть это должно быть так.
<div class="MainFrame"> (и в нем) <div id=container 1> <p> текст - параметры форматирования </div> <div id=container 2> <img> - параметры форматирования </div> <div id=container 3> <href> - параметры форматирования </div> и css .MainFrame { width: 1024px; margin: 20px auto 20px; /*сверху, слева/справа, снизу*/ } .container 1 { ширина высота отступ внешний отступ внутренний } .container 1 { ширина высота отступ внешний отступ внутренний } .container 1 { ширина высота отступ внешний отступ внутренний } Как то так? Не подскажете где подробно описано как настраиваются div блоки с содержимым текст и картинки? Потому что параметров может быть много, например выравнивание размер шрифта тип шрифта размер картинки - подгоняется под размер блока или вставляется в блок как есть и еще я прочитал "Продолжим по отступам, не достаточно использовать * {margin:0; padding:0;} лучше перечислять все, пример: body, td, th, input, select, textarea (в случае, если используется), тем самым мы добьемся одинакового отображения во всех браузерах." То есть тут два десятка параметров может быть, все надо указывать. У меня сайт очень простой, там только текст, картинки и пара баннеров - главное правильно сверстать. А на форумах в основном обсуждают темы например "как сделать выпадающее анимированное меню в css", а вот основ почему то мало.. |
|
|
Bugnet |
12.5.2012, 13:41;
Ответить: Bugnet
Сообщение
#7
|
|
|
Дивы вложенные в другие дивы записывают так:
<div id="RightMenu"><!--открываем внешний--> <div id="RightMenu2"><!--открываем внутренний--> </div><!--закрываем внутренний--> </div><!--закрываем внешний--> Для идентификации используют id=".... " или class="..... ", но у id выше приоритет. Вам необходимо поискать и изучить вопросы приоритетности и наследования стилей. 1. Высота и ширина блоков:height и widht . 2. Выравнивание-обтекание и отмена обтекания: float и clear 3. Как поместить див в див я написал выше, в HTML- коде порядок дивов выжен, в листе стилей - нет разницы в каком порядке записаны стили того или иного блока.
|
|
|
||
|
Похожие темы
Тема | Ответов | Автор | Просмотров | Последний ответ | |
---|---|---|---|---|---|
Требуется помощь по сайту на "ВордПресс" Закрылся доступ в панель администратора |
15 | Tia2 | 2377 | 17.4.2024, 0:54 автор: diviner99 |
|
Качественный современный дизайн сайтов, логотипов, печатной продукции. Верстка. | 27 | zaiko | 17579 | 2.4.2024, 14:00 автор: zaiko |
|
Верстка/Натяжка/Оптимизация/Увеличение функционала шаблонов на WP Разработка на профессиональном уровне |
144 | Gerga | 92142 | 11.3.2024, 19:59 автор: anchous |
|
Разработка/доработка сайтов Wordpress, HTML/CSS/JS Вёрстка, перенос на WP, правки |
9 | malamut | 3484 | 25.1.2024, 14:36 автор: malamut |
|
СОЗДАНИЕ : / САЙтЫ / ЛЕНДЫ / БОТЫ ТГ / ВАЙТЫ / КРЕО / СОФТЫ / ДИЗАЙН [PHP, JS, HTML/CSS] и другое | 5 | CULA | 3417 | 19.12.2023, 18:55 автор: CULA |
Текстовая версия | Сейчас: 24.4.2024, 6:25 |