Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
 
Рейтинг 4.50/14: Рейтинг темы: голосов - 14, средняя оценка - 4.50
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
1

блоки CSS

15.04.2013, 02:08. Просмотров 2791. Ответов 23
Метки нет (Все метки)


Делаю блоки CSS. Что я заметил. Во первых: при уменьшении окна браузера блоки могут немного меняется местами, во вторых: самый нижний блок вдруг вверх пошел. Сайт пустой, просто блоки тренируюсь делать нормальные..
Вот код CSS:
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
#shapka 
{
border: 1px solid red;
height: 200px
}
#menu
{
 
border: 1px solid green;
height: 400px;
width: 150px;
float: left
}
#content
{
border: 1px solid red;
height: 400px;
width: 1200px;
float: left
}
#piar
{
position: fixed;
border: 1px solid red;
height: 400px;
float: right;
 
}
#niz
{
border: 1px solid red;
height: 110px;
 
}
А вот собственно сам HTML:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<html>
<head>
<title>Главная</title>
<link rel="stylesheet" type="text/css" href="css.css" >
</head>
<body>
<div id="shapka">
</div>
<div id="menu">
</div>
<div id="content">
</div>
<div id="piar">
</div>
<div id="niz">
</div>
 
 
 
 
</body>
</html>
Хотелось бы чтобы блоки четко стояли, чтобы не дрыгались. Будут потом с контентом местами меняться... Спасибо
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
15.04.2013, 02:08
Ответы с готовыми решениями:

CSS Задание CSS блоки
Создайте страницу

Блоки CSS
Есть код, который делает три блока как на 1 скрине, при добавлении текста в левый блок(1) , 2 и 3...

Блоки в CSS
Доброго времени суток! Помогите плиз с DIVфами... Существует резиновый сайт. Мне нужно в...

Блоки css
krabo.ru/index.php?route=product/category&amp;path=88 Я чайник, поэтому не знаю как правильно это...

__________________
Помогаю в написании курсовых работ и дипломов здесь.
23
269 / 261 / 35
Регистрация: 21.02.2012
Сообщений: 1,078
15.04.2013, 06:23 2
www.csstemplater.com
0
Администратор
11876 / 5179 / 263
Регистрация: 05.04.2011
Сообщений: 13,935
Записей в блоге: 2
15.04.2013, 09:39 3
maximus2011, ну что Вы на каждый вопрос, касающейся верстки, даете эту ссылку? Лучше объясните своими словами ошибку.
0
269 / 261 / 35
Регистрация: 21.02.2012
Сообщений: 1,078
15.04.2013, 10:15 4
Человек должен сам понять принцип построения блоков, исходя из готового кода. Тогда он и поймет ошибку. А расписывать в теме учебник по html и css не вижу смысла. Тем более, что человек сам сверстал страничку, значит учебник уже читал
0
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
15.04.2013, 10:41  [ТС] 5
Цитата Сообщение от maximus2011 Посмотреть сообщение
Человек должен сам понять принцип построения блоков, исходя из готового кода. Тогда он и поймет ошибку. А расписывать в теме учебник по html и css не вижу смысла. Тем более, что человек сам сверстал страничку, значит учебник уже читал
Да, читал. Сделал так, как это увидел уже сам. Я всего-лишь попросил указать на ошибку.
0
Администратор
11876 / 5179 / 263
Регистрация: 05.04.2011
Сообщений: 13,935
Записей в блоге: 2
15.04.2013, 13:07 6
maximus2011, у меня складывается такое ощущение, что вы просто не можете - своими словами. Тогда лучше промолчать.
0
269 / 261 / 35
Регистрация: 21.02.2012
Сообщений: 1,078
15.04.2013, 18:33 7
ну я незнаю что у вас там и куда складывается, но когда есть конкретный вопрос, я всегда даю конкретный ответ. А когда человек, не может понять элементарных правил css, я не вижу смысла, опять же повторюсь (переписывать в пост учебник по html и css) Самое лучшее понимание - это трудолюбие, а не готовый продукт.
0
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
15.04.2013, 18:51  [ТС] 8
Цитата Сообщение от maximus2011 Посмотреть сообщение
ну я незнаю что у вас там и куда складывается, но когда есть конкретный вопрос, я всегда даю конкретный ответ. А когда человек, не может понять элементарных правил css, я не вижу смысла, опять же повторюсь (переписывать в пост учебник по html и css) Самое лучшее понимание - это трудолюбие, а не готовый продукт.
Ну вообще не трудно было просто изначально написать что здесь я не дописал то то, или нужно дописать то то...
P.S: Я принципиально не пользуюсь программами. И еще одно, я бы не стал заказывать сайт у человека, если бы знал что он пользуется такими программами... Нужно все самому делать. Вот я и пытаюсь сам все делать
0
269 / 261 / 35
Регистрация: 21.02.2012
Сообщений: 1,078
15.04.2013, 20:01 9
Ну это похвально, что вы все сами делаете Но для того, чтобы понять, как правильно строятся блоки, лучше всего разобрать готовые примеры и понять, что и как. Зачем стрить новый велик, пытаясь себе что-то доказать? Возьмите готовый и разберите, потом соберете без подсказок и все. Я лично учился так, брал любой сайт в инете на угад, и копировал его своими руками. Потом сравнивал что получилось. Зато теперь проблем нет, куча мелочей в голове которые всегда пригодяться. А читать и заучивать правила это удел заучек
0
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
15.04.2013, 20:03  [ТС] 10
Цитата Сообщение от maximus2011 Посмотреть сообщение
Ну это похвально, что вы все сами делаете Но для того, чтобы понять, как правильно строятся блоки, лучше всего разобрать готовые примеры и понять, что и как. Зачем стрить новый велик, пытаясь себе что-то доказать? Возьмите готовый и разберите, потом соберете без подсказок и все. Я лично учился так, брал любой сайт в инете на угад, и копировал его своими руками. Потом сравнивал что получилось. Зато теперь проблем нет, куча мелочей в голове которые всегда пригодяться. А читать и заучивать правила это удел заучек
Согласен впринципи. Ну а все же.
0
269 / 261 / 35
Регистрация: 21.02.2012
Сообщений: 1,078
15.04.2013, 20:12 11
Ну вот вам по вашей ситуации коротко:

Все блоки div строятся в ряд по вертикали вниз.

Если вы делаете два или более блока в ряд по горизонтали, всегда нужно применять свойство
CSS
1
float
и не забывать про
CSS
1
clear
это своего рода подставка под горизонтально расположенные блоки. Так же можно использовать свойство
CSS
1
overflow
но иногда его не удобно использовать

CSS
1
position:fixed;
Фиксирует блок в браузере не давая ему двигаться с места. Указывая расположение, вы указываете отступ от краев браузера, если нужно чтобы блок фиксировался относительно родительского блока, значит родительскому блоку нужно указать
CSS
1
position:relative;
то же самое относиться и к блокам с
CSS
1
position:absolute;
ну вот как-то так
1
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
15.04.2013, 20:17  [ТС] 12
Спасибо Пойду теперь тренироваться
0
269 / 261 / 35
Регистрация: 21.02.2012
Сообщений: 1,078
15.04.2013, 20:20 13
незачто, почитайте про эти свойства, поиграйте с ними и больше для работы с блоками впринципе и не надо. Остальное приложится
0
странник
810 / 481 / 108
Регистрация: 28.05.2012
Сообщений: 1,518
Записей в блоге: 2
15.04.2013, 23:10 14
Просто твои блоки не умещаются в по ширине браузера, поэтому начинают прыгать с места на место, при изменении ширины этого браузера.

Оберни эти блоки в div, например c id=wrapper:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
<div id="wrapper">
<div id="shapka">
</div>
<div id="menu">
</div>
<div id="content">
</div>
<div id="piar">
</div>
<div id="niz">
</div>
</div>
и задай этому диву определенную ширину, так понял, надо не меньше 1460px делать.

P.S.
CSS
1
2
3
4
5
6
#piar{
position: fixed; /* так как задано фиксированное положение*/
border: 1px solid red;
height: 400px;
float: right; /* то обтекание не требуется, его никто обтекать не будет. Тоже самое и при position: absolute;*/
}
1
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
15.04.2013, 23:31  [ТС] 15
Как я понял нужно взять и поместить эти блоки в один блок, который будет равен полностью размерам страницы?
0
странник
810 / 481 / 108
Регистрация: 28.05.2012
Сообщений: 1,518
Записей в блоге: 2
15.04.2013, 23:33 16
угу
0
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
15.04.2013, 23:34  [ТС] 17
Цитата Сообщение от Donald28 Посмотреть сообщение
угу
А вот такой момент. Если страница будет увеличиваться по размерам, как поведет себя блок? И еще, какое четкое разрешение нужно ставить? Ведь мониторы у всех разные
0
странник
810 / 481 / 108
Регистрация: 28.05.2012
Сообщений: 1,518
Записей в блоге: 2
15.04.2013, 23:38 18
Цитата Сообщение от vanyakilkil Посмотреть сообщение
Если страница будет увеличиваться по размерам, как поведет себя блок?
блоки будут на месте, только все это будет примыкать к левому краю


Цитата Сообщение от vanyakilkil Посмотреть сообщение
какое четкое разрешение нужно ставить?
Вот тут я не понял. Если разрешение монитора не позволит уместить сайт, то появятся полосы прокрутки
0
38 / 38 / 2
Регистрация: 13.06.2012
Сообщений: 650
15.04.2013, 23:41  [ТС] 19
Вот я бы и не хотел чтобы они появлялись. Чтобы на всех мониторах все подходило.
0
странник
810 / 481 / 108
Регистрация: 28.05.2012
Сообщений: 1,518
Записей в блоге: 2
15.04.2013, 23:47 20
тогда надо, либо уменьшать ширину сайта, чтобы подходило для самого маленького разрешения. Либо делать резиновую верстку (но мне этот стиль не нравится)
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
15.04.2013, 23:47

Заказываю контрольные, курсовые, дипломные работы и диссертации здесь или здесь.

Блоки в css
два блока текста с разным цветом и единым фоном

блоки в css
Здравствйте ребята. Подскажите пожалуйста, какую команду прописать, чтобы блоки при перемещние не...

Блоки в css html
подскажите как сделать 3 блока подряд &lt;div id=&quot;vse&quot;&gt; &lt;div id=&quot;vse1&quot;&gt;&lt;/div&gt; &lt;div...

CSS. Блоки DIV
Всем привет! Зарегался сёдня здесь, в надежде на помощь по CSS. Идея такова, что делаю сайт...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
20
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.