powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / помогите пожалуйста с версткой
9 сообщений из 9, страница 1 из 1
помогите пожалуйста с версткой
    #36073622
Есть картинка (шапка ), что-то типа того:

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
-----------------------------------------------------------------------------------------
|                                                                                      |
|                                  КАРТИНКА3                                          |
|                                                                                      |
|   КАРТИНКА1                                                      КАРТИНКА2          |
|                                                                                      |
|                                                                                      |
|                                  КАРТИНКА4                                           |
|                                                                                      |
------------------------------------------------------------------------------------------
Очень хочется сделать ее резиновой, но так, чтобы при просмотре на бОльшем разрешении становилось как-то так:

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
--------------------------------------------------------------------------------------------
|                           |                    |            |                                  |
|    КАРТИНКА1              |  КАРТИНКА3         |<---->      |     КАРТИНКА2                    |
|                           |                    |            |                                   |
|                          |                     |            |                                   
-----------------------------------------------------------------------------------
|                           |            |                     |                                   |
|                           | <---->     |                     |                                   |
|   КАРТИНКА1               |            |  КАРТИНКА4          |           КАРТИНКА2               |
|                           |            |                     |                                   |
-------------------------------------------------------------------------------------------
т.е. картинки 3 и 4 расползались в разные стороны, но что-то не соображу как это делается. Помогите пожалуйста!
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36073672
Вот для наглядности. Градиент имненно горизонтальный, надписи красные и синие должны разъезжаться в разные стороны.
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36073675
eualexey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
КАК ЭТО ДЕЛАЕТСЯ?,

Дубовый вариант верстаешь таблицей
<table width=90% align=center>
<tr>
<td rowspan=2 width=100px>Картинка 1</td>
<td width=100px align=left>Картинка 3</td>
<td width=100%></td>
<td></td>
<td rowspan=2 width=100px>Картинка 2</td>
</tr><tr>
<td></td>
<td width=100%></td>
<td width=100px align=right>Картинка 4</td>
</tr>
</table>
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36073676
eualexey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
сори забыл код выделить
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
<table width= 90 % align=center>
<tr>
<td rowspan= 2  width=100px>Картинка  1 </td>
<td width=100px align=left>Картинка  3 </td>
<td width= 100 %></td>
<td></td>
<td rowspan= 2  width=100px>Картинка  2 </td>
</tr><tr>
<td></td>
<td width= 100 %></td>
<td width=100px align=right>Картинка  4 </td>
</tr>
</table>
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36073797
Я не очень понял. А может, неправильно объяснил. У меня получилось вот что. А нужно, чтобы в "нормальном окне браузера картинки 3 и 4 были одна под другой, а расползались только на широкоформатниках.
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36073798
Вот так я это сейчас выглядит.
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36073993
eualexey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
КАК ЭТО ДЕЛАЕТСЯ?,

тогда вот так

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
<table width= 90 % align=center>
<tr>
<td rowspan= 2  width=100px>Картинка  1 </td>
<td width= 100 % align=left>Картинка  3 </td>
<td rowspan= 2  width=100px>Картинка  2 </td>
</tr><tr>
<td width= 100 % align=right>Картинка  4 </td>
</tr>
</table>
Если нужно чтобы на картинки были строго одна под другой а при разрешении выше критического начинали расползаться то как я вижу
1) картинки 3,4 делаются размером Ширина экрана - (ширина колонки с картинкой 1 + ширина с картинкой 2 - плохой вариант
2) яваскриптом определяется разрешение экрана и при разрешении выше критического выравнивание для колонки 3 и 4 устанавливается left и right соответственно. по умолчанию они должны быть равны 'center' - тогда получится резинка.
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36075436
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Как вариант...

Код: plaintext
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.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Test</title>
<script type='text/javascript'>
</script>
<style type='text/css'>
* {
	margin:  0 ;
	padding:  0 ;
}
#head {
	width:  100 %;
	height: 200px;
}
#scr1 {
	width:  33 %;
	height: 200px;
	align: center;
	float: left;
	text-align: center;
}
#scr2 {
	width:  33 %;
	height: 200px;
	text-align: center;
	float: left;
}
#cont {
	width:  33 %;
	height: 200px;
	float: left;
}
#scr3 {
	height: 100px;
}
#scr4 {
	height: 100px;
	text-align: right;
}
</style>
</head>

<body>
<div id='head'>
	<div id='scr1'>
		<img src='scr1.jpg' />
	</div>
	<div id='cont'>
		<div id='scr3'>
			<img src='scr3.jpg' />
		</div>
		<div id='scr4'>
			<img src='scr4.jpg' />
		</div>
	</div>
	<div id='scr2'>
		<img src='scr2.jpg' />
	</div>
</div>
</body>
</html>
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
помогите пожалуйста с версткой
    #36075813
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Я бы в данном случае предпочел таблицу. Вряд ли в этом участке будет активное содержимое.
...
Рейтинг: 0 / 0
9 сообщений из 9, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / помогите пожалуйста с версткой
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]