Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.64/11: Рейтинг темы: голосов - 11, средняя оценка - 4.64
0 / 0 / 0
Регистрация: 20.01.2015
Сообщений: 7

Расположение текста в таблице

20.01.2015, 20:20. Показов 2157. Ответов 5
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте, только не смейтесь. В html мягко сказать не бум-бум, стал делать таблицу (1 рис) по инструкции по html, но получается совсем не то и без диаграмм (2 рис). Помогите поправить, чтобы, как на 1ом рисунке. Заранее большое спасибо.
Мой код:
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
<table border='0' cellspacing='0' cellpadding='2' style='border-top:solid 1px #000000; border-left:solid 1px #000000;'>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>Смешанные данные</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>I.  Глава 1</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>Размер зарплаты</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>Раздел 1</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>Раздел 2</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>II. Глава 2</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>Раздел 1</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>Раздел 2</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>   Иванов</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>  Петров</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>Сидоров</td>
</tr>
<tr>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'>*</td>
<td style='border-bottom:solid 1px #000000; border-right:solid 1px #000000;'></td>
</tr>
</table>
Миниатюры
Расположение текста в таблице   Расположение текста в таблице  
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
20.01.2015, 20:20
Ответы с готовыми решениями:

Расположение картинки в таблице
Здравствуйте. Помогите пожалуйста новичку. Не могу сдвинуть картинку в таблице вверх и саму таблицу на уровень картинки слева ...

Расположение текста
Здравствуйте! Есть текст: ФИО: Иванов И.В. Номер телефона: 88005553535 Этот текст находится в блоке div. Они должны быть...

Расположение текста
Доброе время суток! Такая проблема: Есть див. Его стиль font-size: 15px; margin-left: 5px; внутри располагается текст. При...

5
0 / 0 / 2
Регистрация: 20.01.2015
Сообщений: 21
20.01.2015, 21:10
Лучший ответ Сообщение было отмечено barok90 как решение

Решение

<body>

<div style="width:600px;height:250px;border:1 px solid black;margin:0 auto;">
<p style ="text-align:center;font-size:17px;margin-top:2px;">Смешанные данные</p>
<table style="width:98%;height:205px;border:1px solid black;margin:auto;">
<tr style="border:1px solid black;">
<td style="width:30%;border:1px solid black;">
<ul style="list-style-type:upper-roman;font-size:15px;">
<li>Глава 1
<ul>
<li><span>Раздел 1</span></li>
<li><span>Раздел 2</span></li>
</ul>
</li>
<li>Глава 2
<ul>
<li><span>Раздел 1</span></li>
<li><span>Раздел 2</span></li>
</ul>
</li>
</ul>
</td>
<td style="width:70%;border:1px solid black;">Сюда нужно вставить картинку спомощью тега img</td>
</table>
</div>
</body>




Такой код получился,правда картинку тебе нужно будет вставить самому
0
0 / 0 / 0
Регистрация: 20.01.2015
Сообщений: 7
21.01.2015, 00:50  [ТС]
Спасибо.

Добавлено через 2 часа 51 минуту
Теперь встала проблема с вертикальным выравниванием текста "Размер зарплаты". Выравнивание по верхнему краю и середине не получается. Подскажите?
Код:
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
<body>
 
<div style="width:600px;height:250px;border:1px solid black;margin:0 auto;">
<p style ="text-align:center;font-size:17px;margin-top:2px;">Смешанные данные</p>
<table style="width:98%;height:205px;border:1px solid black;margin:auto;">
<tr style="border:1px solid black;">
<td style="width:30%;border:1px solid black;">
<ul style="list-style-type:upper-roman;font-size:15px;">
<li>Глава 1
<ul>
<li><span>Раздел 1</span></li>
<li><span>Раздел 2</span></li>
</ul>
</li>
<li>Глава 2
<ul>
<li><span>Раздел 1</span></li>
<li><span>Раздел 2</span></li>
</ul>
</li>
</ul>
</td>
<td style="width:70%;border:1px solid black;>
<td valign="top">Размер зарплаты</td>
  
</table>
</div>
</body>
0
 Аватар для Al_lord
39 / 39 / 26
Регистрация: 11.01.2014
Сообщений: 343
21.01.2015, 02:35
barok90,
23я строка - лишняя или закройте кавычку перед скобкой
Цитата Сообщение от barok90 Посмотреть сообщение
Выравнивание по верхнему краю и середине не получается.
HTML5
1
<td valign="top" style="text-align: center;" >Размер зарплаты</td>
1
0 / 0 / 0
Регистрация: 20.01.2015
Сообщений: 7
21.01.2015, 02:51  [ТС]
А не подскажете, как вставить картинки с подписями снизу??Чтобы выравнивание было по нижнему краб было.
0
0 / 0 / 2
Регистрация: 20.01.2015
Сообщений: 21
21.01.2015, 09:41
Лучший ответ Сообщение было отмечено barok90 как решение

Решение

только сегодня понял что здесь не картинкой сделано:
вот код,размер шрифтов может и не выдержан но вобщем таблица получилась похожая

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Документ без названия</title>
</head>

<body>

<div style="width:600px;height:250px;border:1 px solid black;margin:0 auto;">
<p style ="text-align:center;font-size:17px;margin-top:2px;">Смешанные данные</p>
<table style="width:98%;height:205px;border:1px solid black;margin:auto;">
<tr >
<td style="width:30%;border:1px solid black;">
<ul style="list-style-type:upper-roman;font-size:15px;">
<li>Глава 1
<ul>
<li><span>Раздел 1</span></li>
<li><span>Раздел 2</span></li>
</ul>
</li>
<li>Глава 2
<ul>
<li><span>Раздел 1</span></li>
<li><span>Раздел 2</span></li>
</ul>
</li>
</ul>
</td>
<td style="width:70%;border:1px solid black;">
<table style="border:1px solid black; width:100%; height:100%;">
<tr style="height:15%;">
<td colspan="3" style="text-align:center;">Размер зарплаты</td>
</tr>
<tr style="border:1px solid black;height:70%;">
<td style="width:33%;height:100%;">
<div style="width:90%;height:70%;background-color:#00F;margin:0 auto;margin-bottom:-35px;"></div>
</td>
<td style="width:33%;height:100%;">
<div style="width:90%;height:90%;background-color:#F00;margin:0 auto;margin-bottom:-10px;"></div>
</td>
<td style="width:33%;height:100%;padding-bottom:0px;">
<div style="width:90%;height:50%;background-color:#0F0;margin:0 auto;margin-bottom:-65px;"></div>
</td>
</tr>
<tr>
<td style="text-align:center;">Иванов</td>
<td style="text-align:center;">Петров</td>
<td style="text-align:center;">Сидоров</td>
</tr>
</table>
</td>
</table>
</div>
</body>
</html>
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
21.01.2015, 09:41
Помогаю со студенческими работами здесь

расположение текста
Всем привет! У меня такая задача, нужно текст расположить в начале кода, т.е. сразу под открывающимся тегом бади, а на экран выводить...

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

Расположение текста в хедере
Всем привет! Использую WordPress. В header.php дописал строчку с текстом и ссылкой, но отображаются они не там где мне нужно. Понимаю, что...

Расположение текста в div
Есть контейнер div, в котором ещё два div. Для первого задан размер и фоновая картинка. Второй содержит текст (&lt;p&gt; ). Размер...

Расположение изображения и текста
Здравствуйте. Как сделать чтобы под изображением был текст выравненный относительно изображения по середине и чтобы такие пары...


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

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Новые блоги и статьи
Ритм жизни
kumehtar 27.02.2026
Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .
SDL3 для Web (WebAssembly): Сборка SDL3 из исходников с помощью CMake и Emscripten
8Observer8 27.02.2026
Недавно вышла версия 3. 4. 2 библиотеки SDL3. На странице официальной релиза доступны исходники, готовые DLL (для x86, x64, arm64), а также библиотеки для разработки под Android, MinGW и Visual Studio. . . .
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами
8Observer8 20.02.2026
Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .
Конвертировать закладки radiotray-ng в m3u-плейлист
damix 19.02.2026
Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI
Eddy_Em 18.02.2026
Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru