Как настроить высоту строки таблицы в HTML5

Я просмотрел сайт и не смог найти ничего, что касалось бы этого конкретного вопроса, относящегося к html5. Хотя всегда возможно, что я упустил это из виду ... Как мне получить высоту строки в 1 пиксель в таблице с помощью html5? Следующий код работает должным образом в html 4.01 (я добавил все, включая кухонную раковину, в попытке получить высоту строки всего 1 пиксель в html5, с добавлением цветов фона для отображения строки таблицы):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>
<body style="background-color:#F3F3F3;">
    <table style='width:500px; vertical-align:top; border-collapse:separate; border:0px; padding:0px; border-width:0px; margin:0px;'>
        <tr style="line-height:1px; vertical-align:top; border-collapse:separate; border:0px; padding:0px; border-width:0px; height:1px; margin:0px; max-height:1px;">
            <td style="background-color:red; line-height:1px; vertical-align:top; border-collapse:separate; border:0px; padding:0px; border-width:0px; height:1px; margin:0px; max-height:1px;">
                <img style="width:100%; height:1px;" src="/images/pixsolid.gif" alt=''>
            </td>
        </tr>
    </table>
</body></html>

Это отображается, как и следовало ожидать, в виде строки высотой в 1 пиксель.

Но если я использую идентичный код с типом документа:

<!DOCTYPE html>

Он отображается как строка высотой 6 пикселей ... Верхние 5 пикселей с красным цветом фона, а затем строка изображения высотой 1 пиксель. (Я бы опубликовал настоящие изображения, но я здесь новичок, и StackOverflow не позволит новичкам публиковать изображения.)

Проблема выглядит идентично в последних версиях Firefox, Chrome и IE, поэтому я ожидаю, что ' м, чего-то не хватает ...

Будем признательны за любые предложения.

9
задан Brian Tompsett - 汤莱恩 2 January 2017 в 20:45
поделиться