Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Форум программистов и сисадминов Киберфорум > Форум web-программистов > HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.83/6: Рейтинг темы: голосов - 6, средняя оценка - 4.83
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313

От куда берется дерево

31.12.2010, 15:36. Показов 1226. Ответов 4
Метки нет (Все метки)
Студворк — интернет-сервис помощи студентам
Не могу понять задумки программиста и логики от куда появляется дерево в div="tree".

Оригинальный index+style:

HTML5
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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79

<!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">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Metamorphosis Design Free Css Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="tree">
    <div id="bg">
        <div id="main">
        <!-- header begins -->
        <div id="header">
            <div id="logo">
                <h1>metamorph_lonetree</h1>
                <h2><a href="http://www.metamorphozis.com/" id="metamorph">Design by Metamorphosis Design</a></h2>
            </div>
            <div id="buttons">
              <div class="but"><a href="#" class="razd_but"  title="">Home</a></div>
              <div class="but"><a href="#" class="razd_but" title="">Blog</a></div>
              <div class="but"><a href="#" class="razd_but" title="">Gallery</a></div>
              <div class="but"><a href="#" class="razd_but" title="">About Us</a></div>
              <div ><a href="#" title="">Contact Us</a></div>
            </div>
        </div>
        <!-- header ends -->
            <div id="conttop"><img src="https://www.cyberforum.ru/images/spaser.gif" alt="" width="1" height="1" /></div>
            <!-- content begins -->
            <div id="content">
                <div id="razd">
                    <div id="left">
                        <h1>Metamorphosis Design</h1>
                        <div class="text">
                        <img src="https://www.cyberforum.ru/images/img1.jpg" width="122" height="112" class="img" alt="" />
                          <span>Lorem ipsum dolor sit amet.</span> <br />
                            Consectetur adipiscing elit. Quisque et sem mi, a semper quam. Etiam nec dapibus diam. Praesent dignissim, quam vel pharetra moles- tie, tortor dolor ullamcorper dui, eget rhoncus urna magna vitae purus. Maecenas non...
                      </div>
                    <div class="read"><a href="#"><img src="https://www.cyberforum.ru/images/but_read.png" alt="" /></a></div>
                    <br />
                    <h1>Free Website Templates</h1>
        <div class="text">
                            <img src="https://www.cyberforum.ru/images/img2.jpg" width="124" height="84" class="img" alt=""  />
                            <span>Aliquam vel eros a eros.</span> <br />
                            Malesuada malesuada et ac eros. Ut neque lorem, eleifend ut scelerisque at, commodo quis velit. Suspendisse quam lacus, gravida eget consequat gravida, laoreet id dui. Sed 
                            non velit turpis. Integer justo lacus, sollicitudin eu convallis a, volutpat non augue. Donec eget eros tellus, id tempus ligula. Integer euismod, augue in hendrerit faucibus, magna quam sollicitudin odio, ac volutpat felis quam non nisi. Fusce et eleifend risus. Curabitur id nunc justo, vel feugiat justo. Aenean condimentum laoreet ullamcorper. Aenean eget metus ipsum. Proin mattis mollisusto. Aenean condimentum laoreet ullamcorper. Aenean eget metus ipsum. Proin mattis mollis molestie...
                      </div>
                        <div class="read"><a href="#"><img src="https://www.cyberforum.ru/images/but_read.png" alt="" /></a></div><br />
                    </div>
                    <div id="right">
                        <h2>Company News</h2>
                        <ul>
                            <li><span class="dat">05-11-2009 </span><br /><span>Etiam nec tempus arcu. </span><br />
                            Donec vitae lacus enim, vitae vulputate mi. Fusce et odio eget lacus imperdiet pulvinar. Morbi mattis, elit eu sodales faucibus, dui purus malesuada mi, eu... 
                            <div class="read"><a href="#"><img src="https://www.cyberforum.ru/images/but_read.png" alt="" /></a></div>
                            </li>
                            <li><span class="dat">05-11-2009 </span><br /><span>Etiam nec tempus arcu.</span><br />
                            Donec vitae lacus enim, vitae vulputate mi. Fusce et odio eget lacus imperdiet pulvinar. Morbi mattis, elit eu sodales faucibus, dui purus malesuada mi, eu... 
                            <div class="read"><a href="#"><img src="https://www.cyberforum.ru/images/but_read.png" alt="" /></a></div>
                            </li>
                        </ul><br />
                    </div>
                    <div style="clear: both"><img src="https://www.cyberforum.ru/images/spaser.gif" alt="" width="1" height="1" /></div>
                </div>
            </div>
            <!-- content ends -->
            <div id="contbot"></div>
            <!-- footer begins -->
            <div id="footer">
          Copyright  2010. Designed by <a href="http://www.metamorphozis.com/" title="Website Templates">Website Templates</a><br />
                <a href="#">Privacy Policy</a> | <a href="#">Terms of Use</a> | <a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional"><abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a> | <a href="http://jigsaw.w3.org/css-validator/check/referer" title="This page validates as CSS"><abbr title="Cascading Style Sheets">CSS</abbr></a></div>
        <!-- footer ends -->
        </div>
    </div>
    <div style="clear: both"><img src="https://www.cyberforum.ru/images/spaser.gif" alt="" width="1" height="1" /></div>
</div>
</body>
</html>

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
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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242

*
{
border: 0;
margin: 0;
}
 
img
{
border: 0px;
}
 
 
a{
    color: #711419;
    text-decoration:none;
}
 
a:hover{
    text-decoration: underline;
    color: #711419;
}
 
body{
    font: 12px Arial, Helvetica, sans-serif;
    color: #000000;
    background: url(images/sky.jpg) center repeat-y;
    line-height:20px;
}
 
#tree {background: url(images/bg_all.jpg) center bottom fixed;
}
 
#bg { width:1012px;
        margin: 0px auto 0px auto;}
 
 
#main{
    width: 631px;
    padding: 60px 0px 0px 0px;
    float:left;
    
}
 
 
#header { width: 631px;
padding: 0px 0px 0px 0px;
height: 147px;
}
 
#logo {
height: 94px;
}
 
#logo h1, #logo p {
    margin: 0;
    line-height: normal;
}
 
#logo h1 {
    padding: 0px;
    font-size: 24px;
    color: #ffffff;
}
#logo h2 {
    padding: 0px;
    font-size: 10px;
    text-transform: uppercase;
    color: #ffffff;
    text-align: left;
}
 
#logo a {
    text-decoration: none;
    color: #ffffff;
}
 
 
#buttons{
    width: 621px;
    height: 47px;
    background: url(images/menu.png) left top no-repeat;
    text-align:center;
    padding-left: 10px;
}
 
.razd_but { background:url(images/but_razd.gif) right center no-repeat;}
 
#buttons .but {
    float:left;
    background:url(images/but_razd.gif) right 2px no-repeat;
}
 
#buttons a {
    font-family: Georgia, Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight:normal;
    display: block;
    float: left;
    width: 120px;
    height: 34px;
    text-decoration: none;
    color: #FFFFFF;
    padding-top: 13px;
    text-align: center;
    background:url(images/fish_but.gif) 0px 19px no-repeat;
    margin-right:3px;
}
 
#buttons a:hover {
    text-decoration: underline;
    background: url(images/but_hover.jpg) 0px 2px repeat-x;
}
 
#content{
    width: 629px;
    padding: 0px 0px 0px 0px;
    background: url(images/bg_cont.png);
    margin: 0px 1px 0px 1px;
}
 
#conttop{
    background: url(images/top.png) 0px 0px no-repeat;
    width: 629px;
    height: 8px;
    margin: 0px 1px 0px 1px;
}
 
#contbot{
    background: url(images/bot.png) 0px bottom no-repeat;
    width: 629px;
    height: 7px;
}
 
#razd {
background:url(images/razd.gif) 415px repeat-y;
width: 629px;
}
 
#left{
    width: 392px;
    padding: 0px 0px 0px 15px;
    margin: 0px;
    float:left;
}
 
#center{float:left;
padding: 0px 0px 0px 11px;
width:315px;
}
 
.text{
    padding: 0px 0px 0px 0px;
}
 
.img {  float:left;
        margin: 5px 13px 5px 0px;
}
 
span {  color:#094A11;
        font-weight:bold;
}
 
.dat { text-decoration:underline;}
 
H1{
    font-family: Georgia, Arial, Helvetica, sans-serif;
    font-size:18px;
    font-weight:normal;
    color: #094A11;
    padding-bottom: 5px;
    padding-left: 0px;
}
 
H2{
    font-family: Georgia, Arial, Helvetica, sans-serif;
    font-size:18px;
    font-weight:normal;
    color: #094A11;
    padding-bottom: 5px;
    text-align:center;
}
 
.read{
    text-align:right;
    padding-right:0px;
    padding-top: 5px;
}
 
#right{
float:right;
width: 182px;
background: url(images/right_bg.gif) left repeat-y;
margin-right: 19px;
 
}
 
 
 
#right ul 
{
    list-style: none;
    padding-left:0px;
    padding-top:0px;
    margin: 0px;
    display:block;
    padding-bottom: 0px;
}
 
#right li{
    padding-top: 5px;
    background: url(images/fish.png) 0px 2px no-repeat;
    padding-left: 30px;
}
 
#footer{
    height: 40px;
    width: 629px;
    font-size: 10px;
    color: #FFFFFF;
    padding-top: 8px;
    text-align: center;
    clear:both;
    padding: 15px 0px 15px 0px;
}
 
#footer a{
    color: #FFFFFF;
    font-size: 10px;
    text-decoration: none;
}
 
#footer a{
    color: #FFFFFF;
    font-size: 10px;
    text-decoration: none;
}
 
#footer a:hover{
    color: #FFFFFF;
    font-size: 10px;
    text-decoration: underline;
}

Пробовал написать код, который будет состоять только из фона тега body и этого самого дерева, фон видно дерево нет:

index.html:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tree</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<div id="tree"></div>
 
</body>
</html>
style.css
CSS
1
2
3
4
5
6
7
8
9
10

body{
    font: 12px Arial, Helvetica, sans-serif;
    color: #000000;
    background: url(images/sky.jpg) center repeat-y;
    line-height:20px;
    }
 
#tree{
    background:url(Images/bg_all.jpg) center bottom fixed;  
    }
Оригинала со всеми файлами: tree1.rar

 Комментарий модератора 
Для выделения кода используйте теги соответствующих языков. Если нет нужного языка, то тег CODE.
Файлы и изображения прикрепляйт к сообщениям.
https://www.cyberforum.ru/abou... 03521.html
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
 31.12.2010, 15:36
Ответы с готовыми решениями:

От куда берется...
От куда берется procedure TForm1.ShowTime; и procedure TForm1.FormPaint(Sender: TObject); ?

Не пойму, от куда берется rar файл
На сервере 2 диска, C(150Гб) D(1Тб). Ежедневно архивируется база с D диска в папку бекап на том же диске. На С диске С свободного места...

в чем проблема с ComboBox ??? не понятно (!!) от куда берется пустая строка в списке комбобокса.
Добрый день. такая проблема: при создании формы в комбобокс добавляю элементы (имена секций из .ini файла). НО не понятно (!!) от куда...

4
9 / 9 / 4
Регистрация: 04.03.2010
Сообщений: 40
01.01.2011, 14:43
Mailo, дерево берется отсюда:
CSS
1
2
3

#tree{
        background:url(Images/bg_all.jpg) center bottom fixed;  
        }
HTML5
1
2
3
4
5
6
7
8
9
10
11
12

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tree</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<div id="tree"></div>
 
</body>
</html>
А
А увидишь ты его, если <div id="tree"> </div> набьешь контентом.
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tree</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<div id="tree">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>
 
</body>
</html>
В шаблоне дерево отображается нормально за счет того, что там есть контент, по высоте расчитанный так, она равнялась примерно высоте рисунка дерева. Если удалить часть текста из шаблона, то дерево обрежется снизу, а если увеличить по высоте контент, то внизу будет фоновая область отображаться( body {background:...};
1
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313
01.01.2011, 16:39  [ТС]
Feax, спасибо за разъяснение, а можно ли как нибудь отразить дерево поверх фона без того что бы div tree набивать контентом?
0
 Аватар для romchiksoad
1957 / 796 / 89
Регистрация: 03.11.2009
Сообщений: 3,066
Записей в блоге: 2
02.01.2011, 12:06
Mailo, попробуйте указать длину/ширину самого блока. Т.е.:
CSS
1
2
3
4

#tree {
    width: 100px;
    height: 100px;
}
А вот этого:
Цитата Сообщение от Mailo Посмотреть сообщение
а можно ли как нибудь отразить дерево поверх фона
Не понял
0
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313
02.01.2011, 19:12  [ТС]
Спасибо всё дошло, то я логику не допонимал
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
 02.01.2011, 19:12
Помогаю со студенческими работами здесь

Есть 4 потока. После осуществления блокировки барьером, 3 куда-то деваются, куда? (pthreads)
Друзья! Как мог упростил код, вот суть В цикле создаются 4 вспомогательных потока, кадый из которых в цикле же 2 раза выводит свой...

PHP mail, куда здесь отправляется товар(сообщение), на почту? Или куда нибудь еще?
НЕМОГУ ПОНЯТЬ КУДА ЭТОТ PHP код ОТПРАВЛЯЕТ ДАННЫЕ??? Помогите пожалуйста! Если же здесь код никуда не отправляет данные помогите...

Процесс обфускации. Куда пишется сам код, куда располагаем алгоритм к возвращению к нормальному состоянию
Добрый вечер. Занимаюсь C# недавно и на работу пока не устроился, т.е. совета спросить негде. Предстоит писать собственный обфускатор...

Откуда берется 2Х
Откуда 2X берётся в самом начале? Объясните пожалуйста,напишите правильное решение.

Берется ли интеграл?
Прошу помощи знатоков. Берется ли такой интеграл: \int \frac{dx}{\sqrt{a-bsinx}} a&gt;0, b&gt;0


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

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
Символьное дифференцирование
igorrr37 13.02.2026
/ * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! */ #include <iostream> #include <stack> #include <cctype>. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce
volvo 10.02.2026
В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Поддержать - Реклама - Условия использования - Обратная связь
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru