PDA

Показать полную графическую версию : [решено] Раздвоение картинки


Страниц : 1 [2]

Habetdin
24-02-2022, 15:22
Как сделать отступ от таблицы (внизу)? »
Используйте свойство padding-bottom (https://developer.mozilla.org/en-US/docs/Web/CSS/padding-bottom)
[hr]то шрифт изменяется везде, а не только на одной таблице? »
Возможно, что браузер "додумывает" и применяет данное свойство ко всей странице, т.к. для неё самой не задано никаких подобных свойств. Можно попробовать явно определить иное значение для основной части страницы:
body { font-size: 12pt; }
[hr]Какую роль выполняет картинка img/trg.gif? (Этот вопрос к Habetdin) »
Увидел её в Вашем коде и заменил её на заглушку за неимением оригинала:
<table width="126" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="right">
<font class="wegray">
<br><a href="javascript:sw('camera')" class="wegray">Текст</a><br>
<br><br>
</font>
<font class="wered">
<img src="img/trg.gif" width="5" height="5" align="center"><a href="@r=2&p=1&a=camera" class="wered">&nbsp; Текст</a>
</font><br>
</td>
</tr>
</table> »

lost8923142
25-02-2022, 13:51
Используйте свойство padding-bottom »
Вставил код вот сюда:
border: 0px;
padding-bottom: 70px;
}
Но как сделать отступ не от текста, а от картинки?
Можно попробовать явно определить иное значение для основной части страницы:
Код:
body { font-size: 12pt; }
»
Покажите пожалуйста на примере, а то я разобраться не могу. Не только шрифт, но и картинка отображается в обоих случаях одна и та же.
Увидел её в Вашем коде и заменил её на заглушку за неимением оригинала: »
Понятно. А почему она не отображается в браузере? (Хотя она и не нужна).


https://i116.fastpic.org/big/2022/0225/44/2df455d635d0c50278f1467b79cfc144.jpg (https://fastpic.org/view/116/2022/0225/2df455d635d0c50278f1467b79cfc144.jpg.html)
img/3.jpg
https://i116.fastpic.org/big/2022/0225/b3/c97831e79eb5722af3aababb939aa1b3.jpg (https://fastpic.org/view/116/2022/0225/c97831e79eb5722af3aababb939aa1b3.jpg.html)
img/6.jpg:
https://i116.fastpic.org/big/2022/0225/3b/f8a40b1e0bb08b4e2425270a3558da3b.jpg (https://fastpic.org/view/116/2022/0225/f8a40b1e0bb08b4e2425270a3558da3b.jpg.html)
<!--- основная таблица -->
<html>

<head>
<meta charset="utf-8">

<title>Эксперименты с таблицей</title>

<style>
table.main {

width: 513px;
height: 78px;
background-image: url(img/3.jpg);

background-repeat: no-repeat;

border-spacing: 0px; /* аналог cellspacing */
border: 0px;
padding-bottom: 70px;
}

table.main td {
padding: 0px; /* аналог cellpadding */


font-size: 9pt}

</style>
</head>

<body>



<!--- основная таблица -->

<table class="main">

<tr>
<td height="6" colspan="2"></td>
</tr>

<tr>
<td width="10" rowspan="2"></td>

<td width="340" valign="top"> <table cellspacing="0" cellpadding="0" border="0">
<tr>
<td valign="top" width="60" rowspan="2"> <img src="img/4.jpg" width="50" height="64"></td>
<td valign="top"> <nobr valign="top">
<font class="we">Aaaaaaaaaaaa</font> </nobr>
</td>
</tr> <tr>
<td valign="top">
<font class="wegrays">Aaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaa
</font>
</td>
</tr> </table>
</td>

<td width="30"></td>
<td valign="middle">
<table width="126" border="0" cellspacing="0" cellpadding="0">
<tr> <td align="right">
<font class="wegray">
<br><a href="javascript:sw('camera')" class="wegray">aaaaaaaaaaaaaaa</a><br> </font> <font class="wered">

<img src="img/trg.gif" width="5" height="5" align="center"><a href="@r=2&p=1&a=camera" class="wered">&nbsp; aaaaaaaaaaaaaaaa</a> </font><br>
</td>
</tr>
</table>
</td> </tr> </table>
</body>

</html>




<!--- основная таблица -->
<html>

<head>
<meta charset="utf-8">

<title>Эксперименты с таблицей</title>

<style>
table.main {

width: 513px;
height: 118px;
background-image: url(img/6.jpg);

background-repeat: no-repeat;

border-spacing: 0px; /* аналог cellspacing */
border: 0px;

}

table.main td {
padding: 0px; /* аналог cellpadding */

}

</style>
</head>

<body>

<!--- основная таблица -->

<table class="main">

<tr>
<td height="6" colspan="2"></td>
</tr>

<tr>
<td width="10" rowspan="2"></td>

<td width="340" valign="top"> <table cellspacing="0" cellpadding="0" border="0">
<tr>
<td valign="top" width="60" rowspan="2"> <img src="img/4.jpg" width="50" height="64"></td>
<td valign="top"> <nobr valign="top">
<font class="we">Aaaaaaaaaaaaaa</font> </nobr>
</td>
</tr> <tr>
<td valign="top">
<font class="wegrays">Aaaaaaaaaaaaa aaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaa
</font>
</td>
</tr> </table>
</td>

<td width="30"></td>
<td valign="middle">
<table width="126" border="0" cellspacing="0" cellpadding="0">
<tr> <td align="right">
<font class="wegray">
<br><a href="javascript:sw('camera')" class="wegray">Aaaaaaaaaaa aaaaaaaaa</a><br> </font> <font class="wered">

<img src="img/trg.gif" width="5" height="5" align="center"><a href="@r=2&p=1&a=camera" class="wered">&nbsp; Aaaaaaaaaaaa aaaaaaaaaaa</a> </font><br>
</td>
</tr>
</table>
</td> </tr> </table>
</body>

</html>

lost8923142
27-02-2022, 17:45
Можно попробовать явно определить иное значение для основной части страницы:
Код:
body { font-size: 12pt; }
»
Покажите пожалуйста на примере, а то я разобраться не могу. Не только шрифт, но и картинка отображается в обоих случаях одна и та же.

Habetdin
27-02-2022, 18:19
Не только шрифт, но и картинка отображается в обоих случаях одна и та же. »
У вас получился документ с близнецом внутри себя, браузеру никак не построить нормально обе таблицы, не говоря уже об отличиях между ними. Необходимо добавить вторую таблицу под первую в единый документ, а не плодить два содержимых <body> друг рядом с другом :)
<html>
<head>
<meta charset="utf-8">
<title>Эксперименты с таблицей</title>
<style>
body {
font-size: 12pt;
}

table.main3 {
width: 513px;
height: 78px;
background-image: url(img/3.jpg);
background-repeat: no-repeat;
border-spacing: 0px;
border: 0px;
padding-bottom: 70px;
}

table.main3 td {
padding: 0px;
font-family: serif; /* стиль шрифта для визуального отличия */
font-size: 9pt
}

table.main6 {
width: 513px;
height: 118px;
background-image: url(img/6.jpg);
background-repeat: no-repeat;
border-spacing: 0px;
border: 0px;
}

table.main6 td {
padding: 0px;
font-family: sans-serif; /* стиль шрифта для визуального отличия */
font-size: 9pt
}
</style>
</head>

<body>
<h1>Первая таблица</h1>
<p>Имеет класс main3</p>
<table class="main3">
<tr>
<td height="6" colspan="2"></td>
</tr>
<tr>
<td width="10" rowspan="2"></td>
<td width="340" valign="top">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td valign="top" width="60" rowspan="2"> <img src="img/4.jpg" width="50" height="64"></td>
<td valign="top">
<nobr valign="top">
<font class="we">Aaaaaaaaaaaa</font>
</nobr>
</td>
</tr>
<tr>
<td valign="top">
<font class="wegrays">Aaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaa </font>
</td>
</tr>
</table>
</td>
<td width="30"></td>
<td valign="middle">
<table width="126" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="right">
<font class="wegray">
<br><a href="javascript:sw('camera')" class="wegray">aaaaaaaaaaaaaaa</a><br>
</font>
<font class="wered">
<img src="img/trg.gif" width="5" height="5" align="center"><a href="@r=2&p=1&a=camera" class="wered">&nbsp; aaaaaaaaaaaaaaaa</a>
</font><br>
</td>
</tr>
</table>
</td>
</tr>
</table>
<h1>Вторая таблица</h1>
<p>Имеет класс main6</p>
<table class="main6">
<tr>
<td height="6" colspan="2"></td>
</tr>
<tr>
<td width="10" rowspan="2"></td>
<td width="340" valign="top">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td valign="top" width="60" rowspan="2"> <img src="img/4.jpg" width="50" height="64"></td>
<td valign="top">
<nobr valign="top">
<font class="we">Aaaaaaaaaaaaaa</font>
</nobr>
</td>
</tr>
<tr>
<td valign="top">
<font class="wegrays">Aaaaaaaaaaaaa aaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaa </font>
</td>
</tr>
</table>
</td>
<td width="30"></td>
<td valign="middle">
<table width="126" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="right">
<font class="wegray">
<br><a href="javascript:sw('camera')" class="wegray">Aaaaaaaaaaa aaaaaaaaa</a><br>
</font>
<font class="wered">
<img src="img/trg.gif" width="5" height="5" align="center"><a href="@r=2&p=1&a=camera" class="wered">&nbsp; Aaaaaaaaaaaa aaaaaaaaaaa</a>
</font><br>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
[hr]А почему она не отображается в браузере? (Хотя она и не нужна). »
Из-за непонятного нагромождения элементов в коде документа. Если возникают проблемы с редактированием HTML-кода, может быть стоит попробовать онлайн WYSIWYG-редактор или тот же Microsoft Word?

lost8923142
02-03-2022, 10:32
При открытии в браузере получилось вот это:

https://i116.fastpic.org/big/2022/0302/eb/160f7a9920c02a8384376af832a2c7eb.jpg (https://fastpic.org/view/116/2022/0302/160f7a9920c02a8384376af832a2c7eb.jpg.html)

Habetdin
02-03-2022, 12:22
lost8923142, опять кодировка файла не совпала с кодировкой из кода — нужно сохранить в UTF-8 :(
<meta charset="utf-8">
Кажется, проще всего заменить в этом участке кода "utf-8" на "windows-1251", раз не получается найти кодировку в редакторе.
Ну а помимо кириллицы, сами картинки то правильно в этот раза отображаются?

lost8923142
05-03-2022, 03:46
проще всего заменить в этом участке кода "utf-8" на "windows-1251" »
Да, в "windows-1251" текст отображается.
Ну а помимо кириллицы, сами картинки то правильно в этот раза отображаются? »
Да, картинки отображаются правильно. :yes:

lost8923142
05-03-2022, 04:22
А ещё вопросик, что сделать, чтобы этот код отобразился на странице браузера?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Заголовок страницы</title>
</head>
<body>
<div style="display:none" class="video-subtitles"><p><span class="video-subtitles-time" href="#t=0m29s">00:00:29</span>AAA AAAAAA</p><p><span class="video-subtitles-time" href="#t=1m45s">00:01:45</span>Скрытый текст</p></div>
</body>
</html>
Отображается белый фон.

Habetdin
05-03-2022, 13:56
lost8923142, уберите этот скрывающий атрибут:
style="display:none" »

lost8923142
05-03-2022, 14:38
уберите этот скрывающий атрибут: »
Спасибо большое, помогли. :)




© OSzone.net 2001-2012