#asp.net #image #mobile-website
#asp.net #изображение #мобильный веб-сайт
Вопрос:
У меня есть мобильный веб-сайт, созданный для одного из моих клиентов. Я создал сайт на своем сервере разработки и на реальном сервере. Когда я загружаю изображение логотипа на сервер разработки и проверяю его на мобильном устройстве, изображение отображается правильно. Но когда я размещаю тот же код на своем реальном сервере, изображение отображается не на мобильном устройстве, а на моем ПК.
Я просто использую простой HTML:
<img src="/image/logo.jpg">
Я даже попробовал приведенный ниже код с кавычками и без кавычек в URL-адресе изображения.
<div style="background-image: url(/image/logo.jpg)" />
Комментарии:
1. ссылка на живой сайт очень помогла бы.
Ответ №1:
Вы должны использовать элемент управления изображением. Просто перетащите его из панели инструментов в Visual Studio и установите изображение на панели свойств:
<asp:Image ID="MyImage" runat="server" ImageUrl="~/image/logo.jpg" />
Тогда вам никогда не придется беспокоиться о путях, потому что ASP.NET всегда будет следить за тем, чтобы он правильно выбирал путь к вашему изображению.
Теперь, если вы используете только HTML, ваша проблема очень проста. Попробуйте удалить первую косую черту. Это должно сработать.
<img src="image/logo.jpg"/>
Или если вы пытаетесь добавить его в качестве фона в div:
<div style="background-image: url("image/logo.jpg");"></div>
И для справки ознакомьтесь с этой страницей непосредственно из MSDN, в которой объясняются практически все возможные способы ссылки на изображения на веб-сайте:
Дайте мне знать, если это поможет.
Ответ №2:
Как указывали другие, проблема связана с путем к каталогу изображений. Мы предполагаем, что каталог изображений находится в корневом каталоге вашего приложения. Ведущее / относится к корневому URL вашего сайта. Использование ~/ в серверных элементах управления приведет к asp.net заменить это на корневой URL вашего приложения. Вот несколько примеров, которые могут прояснить:
www.example.com/someApp/image/logo.jpg
/image/logo.jpg = www.example.com/image/logo.jpg
Неработающая ссылка. Это относится к каталогу за пределами вашего приложения. Если оно работало на вашем сервере разработки, то в его корневом каталоге должен быть каталог изображений.
image/logo.jpg = www.example.com/someApp/image/logo.jpg
Это будет работать до тех пор, пока ссылка находится в корневом каталоге приложения.
~/image/logo.jpg = www.example.com/someapp/image/logo.jpg
Это будет работать независимо от того, где находится ссылка. Но для элемента управления, содержащего ссылку, должно быть установлено значение runat=»сервер».
Ответ №3:
Я думаю, что ваш html не очень хорошо отформатирован для мобильных устройств.
Поместите это в начало вашего html-файла:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
А затем проверьте, правильно ли оно отображается.
Также проверьте веб-сайт с другого мобильного телефона и помните, что старые файлы могут быть кэшированы вашим провайдером.
P.S: Использовать такой тег изображения нормально:
<img alt="the image" src="/image/logo.jpg" />
P.P.S: Правильно ли закрыт ваш тег изображения? В нем отсутствует «/».
Протестируйте это:
<img src="/image/logo.jpg" />
Комментарии:
1. это не исправит тот факт, что вы не можете найти путь к изображению. Это может сделать его действительным, но, безусловно, не исправит неработающую ссылку.
2. @loyal: Я согласен, но похоже, что тег работает на ПК, поэтому я предположил, что ссылка не разорвана. Но было бы очень хорошей идеей проверить, не сломано ли оно или нет.
Ответ №4:
Чтобы решить эту проблему, используйте следующий синтаксис:
< img src=»~/image/logo.jpg «alt=»Не забудьте alt» runat=»сервер»>