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

таблица на html , по середине в ячейке должна быть картинка на заднем фоне по середине

09.07.2012, 20:43. Просмотров 2842. Ответов 19
Метки нет (Все метки)

напишите код пожалуйста: таблица на html , по середине в ячейке должна быть картинка на заднем фоне по середине, причём вынести в отдельный файл css ? перепробовал и через класс , и div , ни чего не получается, везде только кусок показан, может что-то не так делаю? я только учусь, если не трудно подробно. просто везде есть - background: url(image/images (2).jpg) no-repeat; а как его в таблицу правильно запихать не знаю
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
09.07.2012, 20:43
Ответы с готовыми решениями:

Как я могу изменить размеры PictureBox, при этом моя картинка должна оставаться в середине формы
При изменении размера моей картинки, она все время уходит куда-то в сторону. Что делать!

В каждой ячейке таблицы должна быть картинка
Вообщем помогите сделать так чтобы в каждой ячейке таблицы было по изображению , да ещё и размер...

Картинка на заднем фоне
Я вот учусь верстать сайты, вот взял шаблон и у меня не получаться такое сделать скрин, ...

Картинка на заднем фоне
Добрый день. Скажите, пожалуйста, что и где подправить, что бы на картинке было слово с сылкой на...

19
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 21:03 2
HTML5
1
2
3
<table><tr><td></td>
<td id="pic"></td>
<td></td></tr></table>
CSS
1
#pic { background: url('file.jpg') no-repeat center; }
не знаю правда, будет ли работать с таблицами это (не помню)

Добавлено через 1 минуту
Цитата Сообщение от nikotan Посмотреть сообщение
background: url(image/images (2).jpg)
пробелы не катят здесь - измените имя картинки и лучше в апострофы заключать название
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
09.07.2012, 21:33  [ТС] 3
не пашет
HTML5
1
2
3
<tr bordercolor = "#000000">
<td div id="back" align div="center" colspan="3"height="5%" width="100%">
<div id="graf">
css
CSS
1
2
3
4
#back
{
background: url('image/images2.jpg') no-repeat;
}
а есть вобще какой-нибудь другой способ?
0
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 21:41 4
пашет, проверил.

CSS
1
2
3
4
5
6
7
<style type="text/css">
#pic
{
background:url('vis.jpg') no-repeat;
background-position: center;
}
</style>
HTML5
1
2
3
<table border=1 width=800 height=600><tr><td></td>
<td id="pic"></td>
<td></td></tr></table>
скрин:
0
Миниатюры
таблица на html , по середине в ячейке должна быть картинка на заднем фоне по середине  
Эксперт JSЭксперт HTML/CSS
2422 / 1101 / 309
Регистрация: 23.06.2011
Сообщений: 3,450
09.07.2012, 21:42 5
Цитата Сообщение от nikotan Посмотреть сообщение
ни чего не получается, везде только кусок показан, может что-то не так делаю?
Если правильно понял.
Картинка для фона достаточно большая, а в ячейке очень мало текста, поэтому она и не видна вся. Дать этой ячейке те же размеры что и у фоновой картинки.
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
09.07.2012, 22:03  [ТС] 6
картинка меньше таблицы
сюда вставлять?

HTML5
1
2
3
4
5
6
7
8
9
10
<title>laboratorka</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<style type="text/css">
#back
{
background:url('vis.jpg') no-repeat;
background-position: center;
}
</style>
</head>
Добавлено через 10 минут
вот с нуля написал

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html lang"ru">
<head>
<title>laboratorka</title>
<style type="text/css">
#pic
{
background:url('image/images2.jpg') no-repeat;
background-position: center;
}
</style>
</head>
<body>
<table><tr><td></td>
<td id="pic"></td>
<td></td></tr></table>
 
</body>
</html>
не работает
0
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 22:10 7
Цитата Сообщение от newJS Посмотреть сообщение
Картинка для фона достаточно большая, а в ячейке очень мало текста, поэтому она и не видна вся. Дать этой ячейке те же размеры что и у фоновой картинки.
Цитата Сообщение от KOPOJI Посмотреть сообщение
<table border=1 width=800 height=600>
смотрите лучше
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
09.07.2012, 22:16  [ТС] 8
сработало, спасибо, но если в фаил css выношу не работает
0
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 22:17 9
а как и где вы его подключаете? код покажите
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
09.07.2012, 22:26  [ТС] 10
HTML5
1
2
3
4
5
6
7
8
9
10
11
<title>laboratorka</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<style type="text/css">
#back
{
background:url('image/images2.jpg') no-repeat;
background-position: center;
}
</style>
</head>
<body  topmargin="0" leftmargin="0" >
Добавлено через 1 минуту
а остальное работает

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
#graf
 {
 color:white;
 font-size:20;
 font-family:monotype corsiva;
 text-align:center;
 }
 #leftmeny
 {
 color:white;
 font-size:20;
 font-family:monotype corsiva;
 text-align:center;
 }
 #content
 {
 color:white;
 font-size:18;
 /* font-family:monotype corsiva; */
 text-align:center;
 }
0
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 22:31 11
Цитата Сообщение от nikotan Посмотреть сообщение
а остальное работает
я не вижу чтобы в отдельном файле были прописаны стили на таблицу. не вижу код вашей таблицы. выложите все сразу - отдельно html и отдельно css
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
09.07.2012, 23:05  [ТС] 12
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
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang"ru">
<head>
<!-- <meta content="text/html; charset=utf-8" http-eguiv="content-type"> -->
<title>laboratorka</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</style>
</head>
<body  topmargin="0" leftmargin="0" >
<table border="1" height="100%" width="100%">
<tr align="left" bordercolor = "#000000">
<td colspan="5" height="180" width="100%" ><center><img src="image/лого.jpg"></center>
<!-- <img src="image/7864843efbdf.gif"> --></td>
</tr>
<tr bordercolor = "#000000">
<td align div="center" colspan="3"height="5%" width="100%">
<div id="graf"><h2>
<img src="image/polosa3.jpg">
&nbsp&nbsp&nbsp&nbsp&nbspГлавная&nbsp&nbsp&nbsp&nbsp&nbsp
<img src="image/polosa3.jpg"></h2>
</div>
</td> 
</tr>
<tr  >
<td div id="back" height="*" width="130" cellpadding="0" cellspacing="0" valign="top">
<div id="leftmeny">
<img src="image/star.jpg">Меню<img src="image/star.jpg"><br>
<a href="index.html">Главная</a><br>
<a href="new.html">Новости</a><br>
<img src="image/star.jpg">Космос<img src="image/star.jpg"><br>
<a href="planets.html">Планеты</a><br>
<a href="sputnik.html">Спутники</a><br>
<a href="fakt.html">Интересное</a><br>
<a href="links.html">Ссылки</a>
</div>
</td>
 
<td  width="800" valign="top">
<div id="content" >
Несмотря на уровень развития цивилизации,<br>
 человечество все так же знает очень мало об окружающем нас мире.<br>
 Тем не менее, некоторые факты из того,<br>
 что мы знаем, удивительны и непредсказуемы.<br>
 <img src="image/galaxy.jpg"></td>
 </div>
<td div id="back" width="130" cellpadding="0" cellspacing="0" valign="top">
<div id="leftmeny">
<img src="image/star.jpg">Информация<img src="image/star.jpg"><br>
<a href="book.html">книги</a><br>
<a href="video.html">видео</a><br>
<a href="photo.html">фото</a>
</div>
</td>
</tr>
<tr bordercolor = "#000000">
<td colspan="3" height="10%" width="100%">
<div id="graf">
<img src="image/polosa3.jpg">
&nbsp&nbsp&nbsp&nbsp&nbspЛабораторная&nbsp&nbsp&nbsp&nbsp&nbsp<img src="image/polosa3.jpg">
</div>
</td>
</tr>
<tr align="center">
<td colspan="3" height="10%" width="100%">
<a href="index.html">Главная</a>|<a href="kontakt.html">Контакты</a>|<a href="raznoe.html">Разное</a>
</td>
</tr>
</table>
</body>
</html>
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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
html{ overflow-y: scroll;}
 
 
body{
 
  color: white;
   background: black;
    }
a {
    color: white;
    }
    a:link {
    color: white;
    }
    a:visited {
    color: #999999;
    }
p {
 color: red; /* цвет текста параграфов */
 font-family: monotype corsiva; /* гарнитура шрифта параграфов */
 font-size: 20; /* размер шрифта */
 text-align: center; /* текст по центру */
 
 }
 
 
 #graf
 {
 color:white;
 font-size:20;
 font-family:monotype corsiva;
 text-align:center;
 }
 #leftmeny
 
 {
 color:white;
 font-size:20;
 font-family:monotype corsiva;
 text-align:center;
 }
 
 #content
 {
 color:white;
 font-size:18;
 /* font-family:monotype corsiva; */
 text-align:center;
 }
 
#back
{
background:url('image/images2.jpg') no-repeat;
background-position: center;
}
Добавлено через 24 минуты
вот попроще сделал, не работает

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<html lang"ru">
<head>
<title>laboratorka</title>
<link rel="stylesheet" type="text/css" href="css/style2.css">
 
</style>
</head>
<body>
<table border=1 width=800 height=600><tr><td></td>
<td id="pic"></td>
<td></td></tr></table>
 
</body>
</html>

css
CSS
1
2
3
4
5
#back
{
background:url('image/images2.jpg') no-repeat;
background-position: center;
}
 Комментарий модератора 
Используйте теги форматирования кода! Кнопки с мелкими буквами в редакторе.
0
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 23:10 13
Цитата Сообщение от nikotan Посмотреть сообщение
<html lang="ru">
Цитата Сообщение от nikotan Посмотреть сообщение
</style>
лишнее, уберите
Цитата Сообщение от nikotan Посмотреть сообщение
height="*"
это не фрейм, не катит. auto надо тогда
дальше лень смотреть. и оформляйте код соответствующими тегами

Добавлено через 52 секунды
Цитата Сообщение от nikotan Посмотреть сообщение
вот попроще сделал, не работает
ну еще бы.

Цитата Сообщение от nikotan Посмотреть сообщение
<td id="pic">
Цитата Сообщение от nikotan Посмотреть сообщение
css
#back
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
09.07.2012, 23:11  [ТС] 14
ошибку заметил, pic на back поменял, всё равно не работает
0
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 23:21 15
а у меня все работает.
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
<html lang="ru">
<head>
<title>laboratorka</title>
<link href="styles.css" type='text/css' rel='stylesheet'>
</head>
<body>
<table border=1 width=800 height=600><tr><td></td>
<td id="pic"></td>
<td></td></tr></table>
 
</body>
</html>
styles.css:
CSS
1
2
3
4
5
6
#pic
{
background:url('vis.jpg') no-repeat;
 
background-position: center;
}
0
Эксперт по компьютерным сетямЭксперт NIX
11740 / 6717 / 628
Регистрация: 09.09.2009
Сообщений: 26,561
09.07.2012, 23:25 16
а если
CSS
1
background-image:url('image/images2.jpg') no-repeat;
и кстати, путь image/images2.jpg - относительный. картинка в итоге наверное ищется относительно файла css, где ее скорее всего и нету вовсе...
0
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16813 / 6692 / 879
Регистрация: 12.06.2012
Сообщений: 19,968
09.07.2012, 23:31 17
Цитата Сообщение от Dmitry Посмотреть сообщение
а если
оно не будет работать если так, то надо вот таким образом
CSS
1
2
background-image:url('image/images2.jpg');
background-repeat: no-repeat;
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
09.07.2012, 23:33  [ТС] 18
не хочет у меня работать, даже ваш текст скопировал, и css перенёс в ту же папку где и главный и фотку взял очень маленькую, может надо php? а то у меня html? ладно и на этом большое спасибо! если ответите, то завтра продолжим...
0
Эксперт по компьютерным сетямЭксперт NIX
11740 / 6717 / 628
Регистрация: 09.09.2009
Сообщений: 26,561
09.07.2012, 23:43 19
Цитата Сообщение от KOPOJI Посмотреть сообщение
оно не будет работать если так, то надо вот таким образом
да, ошибся...
0
1 / 1 / 2
Регистрация: 23.10.2011
Сообщений: 155
10.07.2012, 07:10  [ТС] 20
заработало, спасибо! "image/" пропустил.
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
10.07.2012, 07:10

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

В нижней левой четверти графического экрана нарисовать круг, в середине круга-эллипс, а в середине эллипса-текст
В нижней левой четверти графического экрана нарисовать круг,в середине круга-эллипс,а в середине...

У меня есть картинка на заднем фоне блока
У меня есть картинка на заднем фоне блока &lt;style&gt; background-postion: center;...

Сделать кнопки в середине экрана, и картинку на фоне растянуть на весь экран
У менять есть 3 кнопки на экране, они в середине(по вертикали и горизонтали), но при этом картинка...

Точка должна мигать в середине экрана
точка должна мигать в середине экрана))как ее сделать в ассемблере


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

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

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