Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Задача
Вставить изображение на веб-страницу.
Решение
Для добавления изображения в документ применяется тег , его атрибут src определяет путь к графическому файлу, который должен быть в формате GIF, PNG или JPEG. Также для тега необходимо указать обязательный атрибут alt , он описывает альтернативный текст видимый в процессе загрузки изображения или при отключении картинок в браузере.
Если графический файл находится в одной папке с HTML-документом, то в качестве пути достаточно указать только имя файла (пример 1).
Пример 1. Добавление картинки на веб-страницу
HTML5 IE Cr Op Sa Fx
Учтите, что когда используется XHTML или строгий HTML4, то тег допустимо размещать только внутри блочных элементов вроде
Есть два способа загрузки изображений: в базу данных или на сервер. В этой статье мы рассмотрим оба метода. Предполагается, что у вас есть базовые знания HTML, PHP и MySQL.
Для загрузки изображения в базу данных требуется выполнить три шага:
1. Создайте HTML-форму для загрузки.
2. Подключитесь к базе данных и сохраните изображения.
3. Отобразите изображения.
Шаг 1. Создайте HTML-форму
Создадим HTML-форму с методом post и сохраним ее в файле с именем upload.html .
Мы отправляем данные из этой HTML-формы в файл getdata.php , с помощью которого изображение будет сохранено в базе данных.
Шаг 2. Подключитесь к базе данных и сохраните изображение
Сначала нужно подключиться к базе данных. В примере мы используем БД «demo».
Чтобы сохранить изображение в базе, нужно использовать для столбца в таблице тип данных blob . MySQL использует BLOB для хранения двоичных данных. Вы можете использовать BLOB TINYBLOB, BLOB, MEDIUMBLOB или LONGBLOB в зависимости от размера загружаемого рисунка.
Шаг 3. Отображение сохраненных изображений из базы данных
Чтобы вывести изображения, нужно создать два файла. Это файл fetch_image.php.
Теперь мы хотим отобразить изображение — это делается с помощью файла display_image.php .
Для загрузки изображения на сервер также потребуется три шага:
1. Создайте HTML-форму для загрузки изображения.
2. Сохраните путь к базе данных и изображение на сервере.
3. Выведите изображение.
Шаг 1. Создайте HTML-форму
Вы можете использовать HTML-форму из предыдущего примера.
Шаг 2. Сохранение изображения на сервере
На этом этапе мы получаем изображение и сохраняем его в каталоге, а затем сохраняем путь к изображению и имя файла в базе данных. Это файл store_image.php.
Шаг 3. Вывод изображений
Чтобы вывести изображение, нужно получить из базы данных имя файла и путь к нему. Это файл fetch_image.php.
Таким образом можно загрузить изображение в базу данных с помощью HTML, PHP и MySQL.
Данная публикация представляет собой перевод статьи « Upload Image to Database and Server using HTML, PHP and MySQL » , подготовленной дружной командой проекта Интернет-технологии.ру
В процессе вёрстки сайта на WordPress приходится вставлять изображения в PHP коде. Сложность заключается в том, что в echo нужно вставить другой php код.
Для этого я использую следующую конструкцию:
Если требуется автоматически вставлять в title и alt текущее названия раздела:
В коде выше присваиваем переменной $img_url путь к файлу изображений, которое нужно вывести. Используется функция get_bloginfo(‘template_url’), которая указывает путь до шаблона WordPress.
Вместо неё можно использовать конструкцию пути от корня сайта:
Для вывода php пути внутри изображения используется конструкции без get: