Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / помогите пожалуйста с версткой / 9 сообщений из 9, страница 1 из 1
04.07.2009, 23:34
    #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
| Ответить | Цитировать | Написать  
05.07.2009, 04:02
    #36073672
КАК ЭТО ДЕЛАЕТСЯ?
КАК ЭТО ДЕЛАЕТСЯ?
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
помогите пожалуйста с версткой
Вот для наглядности. Градиент имненно горизонтальный, надписи красные и синие должны разъезжаться в разные стороны.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
05.07.2009, 05:12
    #36073675
eualexey
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
| Ответить | Цитировать | Написать  
05.07.2009, 05:13
    #36073676
eualexey
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
| Ответить | Цитировать | Написать  
05.07.2009, 14:27
    #36073797
КАК ЭТО ДЕЛАЕТСЯ?
КАК ЭТО ДЕЛАЕТСЯ?
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
помогите пожалуйста с версткой
Я не очень понял. А может, неправильно объяснил. У меня получилось вот что. А нужно, чтобы в "нормальном окне браузера картинки 3 и 4 были одна под другой, а расползались только на широкоформатниках.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
05.07.2009, 14:28
    #36073798
КАК ЭТО ДЕЛАЕТСЯ?
КАК ЭТО ДЕЛАЕТСЯ?
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
помогите пожалуйста с версткой
Вот так я это сейчас выглядит.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
05.07.2009, 19:53
    #36073993
eualexey
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
| Ответить | Цитировать | Написать  
06.07.2009, 15:39
    #36075436
krvsa
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
| Ответить | Цитировать | Написать  
06.07.2009, 17:26
    #36075813
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
помогите пожалуйста с версткой
Я бы в данном случае предпочел таблицу. Вряд ли в этом участке будет активное содержимое.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / помогите пожалуйста с версткой / 9 сообщений из 9, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 470ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1454555]:
 0ms
get settings:
 6ms
get forum list:
 14ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 166ms
get topic data:
 11ms
get forum data:
 2ms
get page messages:
 50ms
get tp. blocked users:
 2ms
others: 215ms
total:  470ms
x
x
Закрыть


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