Как выровнять нарезанные изображения в HTML?

Question

Как выровнять нарезанные изображения в HTML?

0

Мне дали некоторые нарезанные изображения, чтобы собрать их в html. Я сам их не нарезал. Я построил стол. Для каждой строки я поместил 4 изображения с границами, которые нужно выровнять. Окончательный html должен выглядеть как сетка с границами всех изображений, выровненных правильно. Тем не менее, я заметил, что в определенной строке 4 исходных изображения имеют одинаковые размеры. Например.

Я попытался изменить ширину и высоту всех изображений, никаких полей/дополнений в таблице и ячейках. Но границы не выровнены горизонтально и вертикально. Здесь приведен пример одной из строк с исходными размерами изображений. Я знаю, что некоторые из правил могут быть излишними, но я просто пытался все, не найдя решения.

Благодарим вас за вашу обратную связь.

<html>        
<head>
<meta charset="utf-8">
<title>No name</title><style type="text/css">
img {vertical-align: top; margin:0 auto 0 auto; padding:0}
table, td {border:0; padding:0; margin:0; border-collapse: collapse; cellpadding:0; cellspacing:0;}

</style>
</head>
<body>
<pre width="" border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse">
<tr>
<td id="imgA"><a href=""><img src="ImageA" width="187" height="127" alt=""/></a></td>
<td id="imgB"><a href=""><img src="ImageB" width="184" height="127" alt=""/></a></td>
<td id="imgC"><a href=""><img src="ImageC" width="182" height="126" alt=""/></a></td>
<td id="imgD"><a href=""><img src="ImageD" width="187" height="126" alt=""/></a></td>
</tr>
</pre>
</body>
</html>

user3450808 23 март 2014, в 00:20

Источник

1

лол чувак, никто больше так не делает
thelolcat 22 март 2014, в 22:24
0

Я бы порекомендовал использовать divs и css вместо таблиц, это не только менее хлопотно, но и намного быстрее. Этот метод был устаревшим, когда Генрих VIII вел шоу: P
Ben Crook 22 март 2014, в 23:34
0

Мой совет - склеить картинки обратно с помощью графической программы. Но в любом случае, если вы собираетесь использовать HTML, пожалуйста, используйте правильный HTML. Ваш браузер будет благодарен.
Mr Lister 23 март 2014, в 17:56

Показать ещё 1 комментарий

Теги:

html

css

image

border

1 ответ

Ещё вопросы

лол чувак, никто больше так не делает
Я бы порекомендовал использовать divs и css вместо таблиц, это не только менее хлопотно, но и намного быстрее. Этот метод был устаревшим, когда Генрих VIII вел шоу: P
Мой совет - склеить картинки обратно с помощью графической программы. Но в любом случае, если вы собираетесь использовать HTML, пожалуйста, используйте правильный HTML. Ваш браузер будет благодарен.

user3364215 · Answer 1 · 2014-03-24T10-33-00.000Z

вы можете попробовать следующее:

table, td img {width: 100%; height:100% } высота: 100%}

Применить границу в классе img