Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Форум программистов и сисадминов Киберфорум > Форум вебмастеров > HTML, CSS
Войти
Регистрация
Восстановить пароль
Карта форума Темы раздела Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 5.00/9: Рейтинг темы: голосов - 9, средняя оценка - 5.00
25 / 9 / 17
Регистрация: 22.12.2015
Сообщений: 2,097
1

Опустить кнопку и текст в ячейку таблицы

22.09.2017, 19:52. Показов 1761. Ответов 7
Метки нет (Все метки)
Author24 — интернет-сервис помощи студентам
realsite.rar
Она оранжевого цвета в верхнем правом углу.Ее нужно опустить на шапку шайта.Делал верстку блочно табличным методом и у меня где то она таблица поместилась в другую.А вот где.

еще меню над шапкой там где синим Home после него вправо еще 7 пунктов есть.Только они доступны при наведении мыши.А это неправильно.
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
 22.09.2017, 19:52
Ответы с готовыми решениями:

Как добать кнопку в ячейку таблицы?
Как добать кнопку в ячейку QTableVeiw? Если с помощью QTableVeiw этого сделать нельзя, то каким...

Как сложить текст из других ячеек в вычисляемую ячейку чтобы был виден текст а не значение ссылок на другие таблицы
С новым годом господа :-) Прошу немного сориентировать в решении нужной мне задачи. Собсно...

Перемещение картинки в ячейку таблицы по нажатию на кнопку
<html> <head> <script language="JavaScript"> function TestFunc(f) { ...

Внести текст в ячейку таблицы Word
Доброго времени суток. Помогите решить следующую задачку. Имеется файл .docx с таблицей. Я его...

7
25 / 9 / 17
Регистрация: 22.12.2015
Сообщений: 2,097
22.09.2017, 19:57  [ТС] 2
Опустить кнопку и текст в ячейку таблицы

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
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

<!DOCTYPE html>
<html >
<head>
    <title> Верстка реального сайта </title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
    <link rel="stylesheet" href="styles/styles.css"/>
   <!-- a persistent style sheet -->
 
<!--[if ite IE 7]>
<link rel="stylesheet" href="ie6ie7.css"/>
<![endif]-->
</head>
    <body>
    
        <div id = "logo">
            <table>
                <tr>
                    <td>
                        <img src="images/logo.jpg"   alt="Логотип"/>
                    </td>
                    
                    <td class ="right" >
                        <p class ="gray">For Addition Information,Contact Us!  </p> 
                        <p class ="green">info@memostra.com </p>    
                    </td>
                
                </tr>
            </table>
        </div>
        
            <div  id = "topmenu">
                <ul>
                    <li class ="active" >
                        <a href ="#">
                            <span> Home</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span> About</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span> Clothing</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span> Soes</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span>Electronics</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span>Pefumes</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                        <span>Contact Us</span>
                        </a>
                       </li>
                </ul>
            </div>
                
                
                
                
                    <div   id = "contacs">
                        <a href ="#">
                            <img src="images/facebook.jpg"   alt="facebook"/>
                        </a>
                        
                        <a href ="#">
                            <img src="images/email.jpg"   alt="email"/>
                        </a>
                    </div>
                
                
                <div class ="clear">
                </div>  
            
            
            <div class ="header">
                    <img src="images/header.jpg"   alt="Шапка сайта"/>
                    <div id ="content_header">
                        <h1>Welcome to Mostra!</h1>
                        <h3>Qualitu Products -Freat prices!</h3>
                        <p>
                                <a href ="#">
                                    <span>Check it out!</span>
                                </a>
                        </p>
                    </div>
            </div>  
        
    <div id ="menu">    
    <table>
    <tr>
    <td>
    <table>
        
                    
        <tr>
                <td class ="active">
                    <a href ="#">
                    <span>All categories</span>
                    </a>
                </td>
                
                <td>
                    <a href ="#">
                    <span>Men</span>
                    </a>
                </td>
                
                <td>
                    <a href ="#">
                    <span>Women</span>
                    </a>
                </td>
        </tr>
    </table>
    </td>   
            
             <td class="right">
                    <div id ="search">
                        <form name="searchform" action="#" method="post">
                            <table>
                                <tr>
                                    <td>
                                        <div>
                                            <input type="text" name="words" value="Brouse products"/>
                                        </div>
                                    </td>
                                
                                    <td>
                                        <input type="image" src="images/search.jpg" alt="button search"/>
                                    </td>
                               </tr>
                            </table>
                        </form>
                    </div>
            </td>
    </td>
    </tr>    
    </table>
    <div class="separator">
    </div>
        
</body>
</html>
0
25 / 9 / 17
Регистрация: 22.12.2015
Сообщений: 2,097
22.09.2017, 19:58  [ТС] 3
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

body{
    font-family:Arial,'Times New Roman',sans-serif;
    font-size:12pt;
    margin:0;
    padding:20px,40px,20px,41px;
}
.clear{
    clear:both;
}
#logo table{
    width:100%;
}
 
.right{
    text-align:right;
}
#logo p{
    margin:0;
    font-style:italic;
}
.gray{
    color:#afaeae;
}
.green{
    color:#91aa77;
    font-weight:bold;
}
#topmenu{
    background-color:#538bc5;
    margin-top:20px;
}
#topmenu ul{
    margin:0;
    padding:0;
}
#topmenu ul li{
    float:left;
    list-style:none;
}
#topmenu ul li a{
 color:#fff;
 font-size:120%;
 display:block;
 padding:10px 20px;
 text-decoration:none;
}
 
#topmenu ul li.active a, #topmenu ul li a:hover{
    background-color:#375c84;
    
}
#contacs{
    float:right;
    margin:10px 10px 0 0;
}
#contacs a{
      text-decoration:none;
}
#header{
    margin-top:15px;
}
#header img{
    width:100%;
}
#content_header{
    float:right;
    text-align:right;
    position:relative;
    top:-150px;
    right:20px;
}
#content_header h1,#content_header h3{
     margin:0;
}
#content_header h1{
    color:#688fb1;
    font-size:210%;
}
#content_header h3{
    color:#91a9bd;
    font-size:100%;
}
#content_header p{
    margin-top:30px;
}
#content_header a{
    background-color:#d8812e;
    color:#fff;
    padding:10px 20px;
    text-decoration:none;
}
#menu{
    margin-top:15px;
}
#menu.right{
    text-align:right;
}
 #menu table{
     width:100%;
 
 }
  #menu table table{
     width:auto;
     
 }
#menu td a{
    background-color:#ececec;
    color:#a0a0a0a0;
    display:block;
    font-weight:bold;
    padding:10px 20px;
    text-decoration:none;
}
 
#menu td.active a,#menu td a:hover{
        background-color:#e2ecf4;
        color:#3b638f;
}
 
 
#search div{
        border:1px solid #aec697;
        margin-top:-4px;
}
#search div input{
    border:3px solid #cbddbb;
    color:#ececec;
    height:25px;
    width:200px;
    padding-left:5px;
}
#search {
    float:right;
}
.separator{
    border-top:1px dashed #b6c6dd;
    height:1px;
    width:100%;
    margin-top:15px;
}
0
Эксперт JSЭксперт HTML/CSS
3825 / 2675 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
22.09.2017, 20:01 4
Вы же сами все это подняли.
CSS
1
2
3
4
5
6

#content_header {
    /* ... */
    position: relative;
    top: -150px;
    /* ... */
}
И исправьте ошибки в разметке - https://validator.w3.org/
0
25 / 9 / 17
Регистрация: 22.12.2015
Сообщений: 2,097
22.09.2017, 20:52  [ТС] 5
Error: Stray end tag td.
From line 155, column 18; to line 156, column 9
</td>↩ </td>↩ <


Error: End tag for body seen, but there were unclosed elements.
From line 162, column 1; to line 162, column 7
↩ ↩</body>↩</htm


Error: Unclosed element div.
From line 108, column 5; to line 108, column 20
↩ <div id ="menu"> ↩

я с таблицами все напутал потому валидатор и ругаеться.

Добавлено через 4 минуты
справил ошибки валидатора
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
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

<!DOCTYPE html>
<html >
<head>
    <title> Верстка реального сайта </title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
    <link rel="stylesheet" href="styles/styles.css"/>
   <!-- a persistent style sheet -->
 
<!--[if ite IE 7]>
<link rel="stylesheet" href="ie6ie7.css"/>
<![endif]-->
</head>
    <body>
    
        <div id = "logo">
            <table>
                <tr>
                    <td>
                        <img src="images/logo.jpg"   alt="Логотип"/>
                    </td>
                    
                    <td class ="right" >
                        <p class ="gray">For Addition Information,Contact Us!  </p> 
                        <p class ="green">info@memostra.com </p>    
                    </td>
                
                </tr>
            </table>
        </div>
        
            <div  id = "topmenu">
                <ul>
                    <li class ="active" >
                        <a href ="#">
                            <span> Home</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span> About</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span> Clothing</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span> Soes</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span>Electronics</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                            <span>Pefumes</span>
                        </a>
                    </li>
                    
                    <li>
                        <a href ="#">
                        <span>Contact Us</span>
                        </a>
                       </li>
                </ul>
            </div>
                
                
                
                
                    <div   id = "contacs">
                        <a href ="#">
                            <img src="images/facebook.jpg"   alt="facebook"/>
                        </a>
                        
                        <a href ="#">
                            <img src="images/email.jpg"   alt="email"/>
                        </a>
                    </div>
                
                
                <div class ="clear">
                </div>  
            
            
            <div class ="header">
                    <img src="images/header.jpg"   alt="Шапка сайта"/>
                    <div id ="content_header">
                        <h1>Welcome to Mostra!</h1>
                        <h3>Qualitu Products -Freat prices!</h3>
                        <p>
                                <a href ="#">
                                    <span>Check it out!</span>
                                </a>
                        </p>
                    </div>
            </div>  
        
    <div id ="menu">    
         <table>
              <tr>
                 <td>
                    <table> 
                     <tr>         
                         <td class ="active">
                             <a href ="#">
                             <span>All categories</span>
                             </a>
                         </td>
                
                          <td>
                             <a href ="#">
                             <span>Men</span>
                             </a>
                          </td>
                
                           <td>
                                <a href ="#">
                                <span>Women</span>
                                </a>
                          </td>
                    </tr>
                    </table>
                </td>
            
             <td class="right">
                    <div id ="search">
                        <form name="searchform" action="#" method="post">
                            <table>
                                <tr>
                                    <td>
                                        <div>
                                            <input type="text" name="words" value="Brouse products"/>
                                        </div>
                                    </td>
                                
                                    <td>
                                        <input type="image" src="images/search.jpg" alt="button search"/>
                                    </td>
                               </tr>
                            </table>
                        </form>
                    </div>
            </td>
       </tr>     
    </table>
    </div>
    
    
    
    <div class="separator">
    </div>
        
</body>
</html>
Добавлено через 2 минуты
Цитата Сообщение от mrtoxas Посмотреть сообщение
Вы же сами все это подняли.
Что посоветуете с этим делать,удалить полность как класс с цсс файла или величину top:-150 px уменшить,поиграться в Firebug /webdevelopere в мазицеле фаервокс?
0
Эксперт JSЭксперт HTML/CSS
3825 / 2675 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
22.09.2017, 20:55 6
Уберите top: -150px;
0
25 / 9 / 17
Регистрация: 22.12.2015
Сообщений: 2,097
22.09.2017, 21:35  [ТС] 7
CSS
1
2
3
4
5
6

#content_header {
    /* ... */
    position: relative;
    top: 30px;//помогло
    /* ... */
}
Теперь осталось меню сделать видимым

Добавлено через 37 минут
Исправил цвет меню
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14

#topmenu ul li.active a, #topmenu ul li a:hover{
background-color: #375c84;//Цвет заливки темно синий для первого пункта меню и при наведении на остальные
color:#fff;//белый цвет шрифта  первого пункта меню Home
}
 
 
#topmenu ul li a{
 color: #fff;//белый цвет шрифта остальных пунктов меню при наведении и без него
 font-size:120%;
 display:block;
 padding:10px 20px;
 text-decoration:none;
 background-color:#538bc5; //заливка ближе к голубой
}
0
25 / 9 / 17
Регистрация: 22.12.2015
Сообщений: 2,097
22.09.2017, 21:52  [ТС] 8
Осталось еще две задачи
Опустить кнопку и текст в ячейку таблицы
0
22.09.2017, 21:52
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
 22.09.2017, 21:52
Помогаю со студенческими работами здесь

Как в ячейку таблицы вписать текст
Тут возникла такая необходимость: есть ссылка и есть ячейка таблицы. Как сделать так, что бы при...

Как в ячейку таблицы вписать текст
function test() { document.getElementById(&quot;td3&quot;).innertext = &quot;F-11&quot;; } &lt;table&gt;...

В ячейку таблицы вставить текст из файла txt
Есть таблица (&lt;table&gt;) через js обращаюсь к отдельной ячейке ...

При клике по ячейке вставить текст в другую ячейку этой же таблицы
Здравствуйте! У меня есть таблица: &lt;table&gt; &lt;tbody&gt; &lt;tr&gt; ...


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

Или воспользуйтесь поиском по форуму:
8
Ответ Создать тему
КиберФорум - форум программистов, компьютерный форум, программирование
Поддержать - Реклама - Обратная связь
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru