Отступ между картинками

@Ивванн · Регистрация: 12.10.2017

Author24 — интернет-сервис помощи студентам

Есть код:
<!DOCTYPE HTML>
<html>
<head>

</head>
<body>
<div>
<img src="6.jpg"><img src="7.jpg"><img src="9.jpg"><br>
<img src="5.jpg"><img src="3.jpg"><img src="1.jpg"><br>
<img src="8.jpg"><img src="2.jpg"><img src="4.jpg">
</div>
</body>
</html>
Но между картинками существуют пробелы как их убрать не знаю.

@AlexZaw · 10.09.2018, 15:24

CSS
1
2
3
img{
  vertical-align: middle;
}

@Kraken73 · 10.09.2018, 15:30

Ивванн,
1) для родителя line-height: 0;
2) на картинки

CSS
1
2
display: block;
float: left;

3) на родителя

CSS
1
2
display: flex;
flex-wrap: wrap;

ну или как написали выше

@AlexZaw · 10.09.2018, 15:43

Сообщение от Kraken73

2) на картинки
CSSВыделить код
display: block;
float: left;

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

@Ивванн · 10.09.2018, 15:43 **[ТС]**

AlexZaw, пишу ничего не преисходит, перед div вставлять?

@AlexZaw · 10.09.2018, 16:02

Сообщение от Ивванн

пишу ничего не преисходит, перед div вставлять?

Вставлять в файл стилей. Ну или в вашем случае, если вы еще не знаете что это такое добавить для каждой картинки valign='top'

@Ивванн · 10.09.2018, 17:32 **[ТС]**

AlexZaw, можете написать как этот код должен получится.

@AlexZaw · 10.09.2018, 18:21

HTML5
1
<img src="6.jpg" valign='top'>

И так у каждой картинки

@Ивванн · 10.09.2018, 18:24 **[ТС]**

AlexZaw, спасибо.

Новые блоги и статьи Все статьи Все блоги /
Согласованность транзакций в MongoDB Codd 30.04.2025 MongoDB, начинавшая свой путь как классическая NoSQL система с акцентом на гибкость и масштабируемость, сильно спрогрессировала, включив в свой арсенал поддержку транзакционной согласованности. Это. . .	Продвинутый ввод-вывод в Java: NIO, NIO.2 и асинхронный I/O Javaican 30.04.2025 Когда речь заходит о вводе-выводе в Java, классический пакет java. io долгие годы был единственным вариантом для разработчиков, но его ограничения становились всё очевиднее с ростом требований к. . .	Обнаружение объектов в реальном времени на Python с YOLO и OpenCV AI_Generated 29.04.2025 Компьютерное зрение — одна из самых динамично развивающихся областей искусственного интеллекта. В нашем мире, где визуальная информация стала доминирующим способом коммуникации, способность машин. . .	Эффективные парсеры и токенизаторы строк на C# UnmanagedCoder 29.04.2025 Обработка текстовых данных — частая задача в программировании, с которой сталкивается почти каждый разработчик. Парсеры и токенизаторы составляют основу множества современных приложений: от. . .	C++ в XXI веке - Эволюция языка и взгляд Бьярне Страуструпа bytestream 29.04.2025 C++ существует уже более 45 лет с момента его первоначальной концепции. Как и было задумано, он эволюционировал, отвечая на новые вызовы, но многие разработчики продолжают использовать C++ так, будто. . .
Слабые указатели в Go: управление памятью и предотвращение утечек ресурсов golander 29.04.2025 Управление памятью — один из краеугольных камней разработки высоконагруженных приложений. Го (Go) занимает уникальную нишу в этом вопросе, предоставляя разработчикам автоматическое управление памятью. . .	Разработка кастомных расширений для компилятора C++ NullReferenced 29.04.2025 Создание кастомных расширений для компиляторов C++ — инструмент оптимизации кода, внедрения новых языковых функций и автоматизации задач. Многие разработчики недооценивают гибкость современных. . .	Гайд по обработке исключений в C# stackOverflow 29.04.2025 Разработка надёжного программного обеспечения невозможна без грамотной обработки исключительных ситуаций. Любая программа, независимо от её размера и сложности, может столкнуться с непредвиденными. . .	Создаем RESTful API с Laravel Jason-Webb 28.04.2025 REST (Representational State Transfer) — это архитектурный стиль, который определяет набор принципов для создания веб-сервисов. Этот подход к построению API стал стандартом де-факто в современной. . .	Дженерики в C# - продвинутые техники stackOverflow 28.04.2025 История дженериков началась с простой идеи — создать механизм для разработки типобезопасного кода без потери производительности. До их появления программисты использовали неуклюжие преобразования. . .

@Ивванн 1 / 1 / 0 Регистрация: 12.10.2017 Сообщений: 220

	Отступ между картинками 10.09.2018, 14:20. Показов 25443. Ответов 8 Метки нет (Все метки) Есть код: <!DOCTYPE HTML> <html> <head> </head> <body> <div> <img src="6.jpg"><img src="7.jpg"><img src="9.jpg"><br> <img src="5.jpg"><img src="3.jpg"><img src="1.jpg"><br> <img src="8.jpg"><img src="2.jpg"><img src="4.jpg"> </div> </body> </html> Но между картинками существуют пробелы как их убрать не знаю. 0

@Ивванн 1 / 1 / 0 Регистрация: 12.10.2017 Сообщений: 220
	10.09.2018, 15:43 [ТС]
	AlexZaw, пишу ничего не преисходит, перед div вставлять? 0

@Ивванн 1 / 1 / 0 Регистрация: 12.10.2017 Сообщений: 220
	10.09.2018, 17:32 [ТС]
	AlexZaw, можете написать как этот код должен получится. 0

@Ивванн 1 / 1 / 0 Регистрация: 12.10.2017 Сообщений: 220
	10.09.2018, 18:24 [ТС]
	AlexZaw, спасибо. 0

Опции темы

Отступ между картинками

Решение