2015-03-04 4 views
2

Hy all. У меня проблема с моим базовым кодом HTML. Моя задача - объединить 4 части изображения без видимых полей. Im разрешено использовать только HTML-код без CSS-элементов, и я должен использовать таблицу. Моя проблема в том, что я не могу избавиться от пространства между строками. Я объяснил, что расстояние между границами происходит из таблицы стилей таблицы браузера webkit. Есть ли способ использовать только HTML-код для удаления этого интервала. Забыл упомянуть размеры изображения в 3 - х 200px 200px и 1- 600px х 200pxHTML - удаление дополнительных пикселей из строк таблицы

Chrome отладчик показывает, что дополнительный 4px наследуется от таблицы стилей

table { 
display: table; 
border-collapse: separate; 
border-spacing: 2px; 
-webkit-border-horizontal-spacing: 2px; 
-webkit-border-vertical-spacing: 2px; 
border-color: gray; 
} 

P.S. Если я устанавливаю высоту изображения = «100%» и ширину = «100%», чем достижу своей цели, но я не уверен, что это правильный способ сделать это.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 

<html> 
<head> 
<title>LR1</title> 
</head> 
<body> 
<!--Using table without CSS--> 
<table bgcolor="green" border="0px" cellpadding="0px" cellspacing="0px"> 
<tbody> 
<tr> 
    <td ><img src="p_01.jpg" alt="Part 1" width="200px" height="200px"></td> 
    <td ><img src="p_02.jpg" alt="Part 2" width="200px" height="200px"></td> 
    <td ><img src="p_03.jpg" alt="Part 3" width="200px" height="200px"></td> 
</tr> 
<tr > 
    <td colspan="3"> 
     <a href="http://en.wikipedia.org/wiki/Swan" target="_blank"><img src="p_04.jpg" alt="Part 4" width="600px" height="200px"> 
     </a> 
    </td> 
</tr> 
</tbody> 
</table> 
</body> 
</html> 
+0

Если вы установили изображение на 'height =" 100% "', чем вы достигнете своей цели. Вы можете продолжать определять это. – bcesars

+0

Зачем положить четыре фотографии в стол? Почему бы не сделать одну фотографию? А почему таблица вместо divs? – GolezTrol

+0

В моей задаче указано, что я должен объединить 4 части изображения, чтобы получить одну большую картинку. Необходимо использовать таблицу без CSS и использовать 4.01 strict! DOCTYPE. Подумайте, учитель фигуры учитель =) – Celmlauzis

ответ

0

Единственный способ, который я нашел, чтобы решить вашу проблему, - добавить к изображению стиль = "display: block". Дисплей: inline по умолчанию добавляет дополнительное пространство в ячейку.

+0

Без помех для сотовой связи или сотовой ячейки есть дополнительный интервал – Celmlauzis

Смежные вопросы