Вопросы Теги

Загадочное пустое пространство под тегом изображения [дубликат]

Вам необходимо зарегистрировать привязку аннотации для Jackson в вашем spring-mvc-config.xml, например: 

<!-- activates annotation driven binding -->
<mvc:annotation-driven ignoreDefaultModelOnRedirect="true" validator="validator">
    <mvc:message-converters>
        <bean class="org.springframework.http.converter.ResourceHttpMessageConverter"/>
        <bean class="org.springframework.http.converter.xml.Jaxb2RootElementHttpMessageConverter"/>
        <bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"/>
    </mvc:message-converters>
</mvc:annotation-driven>

Затем в вашем контроллере вы можете использовать: 

@RequestMapping(value = "/your_url", method = RequestMethod.GET, produces = "application/json")
@ResponseBody
29
задан Michael_B 6 October 2015 в 15:26
поделиться

3 ответа

По умолчанию IMG является встроенным элементом. Вам нужно установить тэг IMG в качестве блочного элемента, что может быть выполнено с помощью этого стиля: 

display: block;
19
ответ дан Kaitebug 6 October 2015 в 15:26
поделиться

Посмотрите на эту строку текста. Обратите внимание, что нет букв, которые нарушают базовый уровень.

Теперь посмотрите на следующее предложение:

Просто пересекая мост, он, вероятно, сбежал.

Обратите внимание на буквы j , g , p и y . Эти буквы, известные в типографии как спусковые устройства , нарушают базовый уровень .

enter image description here

Источник: Wikipedia.org

Значение по умолчанию свойство vertical-align равно baseline. Это относится к элементам встроенного уровня.

Ваш img является встроенным по умолчанию и, как и текст, span, input, textarea и другие встроенные блоки, выровнен по базовой линии. Это позволяет браузерам предоставлять пространство, необходимое для размещения спусковых устройств.

Обратите внимание, что зазор не создается с помощью полей или отступов, поэтому его нелегко обнаружить в инструментах разработчика. Это небольшое возвышение контента от нижнего края контейнера в результате выравнивания базовой линии.

Вот несколько способов справиться с этим:

  1. Применить vertical-align: bottom к тегу img. В некоторых случаях bottom не будет работать, поэтому попробуйте middle, top или text-bottom.
  1. Переключение с display: inline на display: block.
  1. Настройте свойство line-height для контейнера. В вашем коде ссылки (так как удалено из-за linkrot ), line-height: 0 добился цели.
  1. Установите font-size: 0 на контейнере. При необходимости вы можете восстановить размер шрифта дочернего элемента напрямую.

Связано:

64
ответ дан Community 6 October 2015 в 15:26
поделиться

Добавить 

display: block;

к <img>.

7
ответ дан Sebastian Simon 6 October 2015 в 15:26
поделиться