При создании дизайна для сайтов мне частенько приходится создавать бесшовный фон. Чтобы просмотреть результат работы приходилось сохранять картинку, создавать в той же папке html файл и прописывать свойства у соответствующего элемента. Но оказывается photoshop умеет это делать автоматически.
Заранее извиняюсь что на скринах photoshop не русифицированный, я постаралась выделить необходимые элементы цветом.
Итак, возьмем для примера простейший рисунок:
![image](https://habrastorage.org/r/w780q1/getpro/geektimes/post_images/732/eb1/3ad/732eb13adcc7c5c9926a29c9ce634df3.jpg)
Теперь идем в меню и выбираем File > Save for Web & Devices, как обычно делается при сохранении изображений для веба.
![image](https://habrastorage.org/r/w780q1/getpro/geektimes/post_images/d59/cd9/53a/d59cd953ac3467ac2d772d06c80b5257.jpg)
Как видно на скрине в открывшемся окне в правом верхнем углу разворачиваем список опций и выбираем Edit Output Settings и в выпадающем списке Settings выбираем Background image
![image](https://habrastorage.org/r/w780q1/getpro/geektimes/post_images/659/94d/ed7/65994ded7cfcc7e7f9c382770837b06e.jpg)
Жмем ОК, окно при этом закрывается и нажимаем Preview
![image](https://habrastorage.org/r/w780q1/getpro/geektimes/post_images/9cc/8d4/7c2/9cc8d47c28e7ce939cac24defc879d53.jpg)
В результате открывается браузер и мы видим нашу картинку в качестве фона у страницы.
![image](https://habrastorage.org/r/w780q1/getpro/geektimes/post_images/1c3/251/873/1c3251873a845a1302c2dbca60865a84.jpg)
Конечно, белая таблица с кодом страницы мешается и я пока не нашла как от нее избавиться, но зато уже можно получить представление как будет выглядеть наш фон.
Заранее извиняюсь что на скринах photoshop не русифицированный, я постаралась выделить необходимые элементы цветом.
Итак, возьмем для примера простейший рисунок:
![image](https://habrastorage.org/getpro/geektimes/post_images/732/eb1/3ad/732eb13adcc7c5c9926a29c9ce634df3.jpg)
Теперь идем в меню и выбираем File > Save for Web & Devices, как обычно делается при сохранении изображений для веба.
![image](https://habrastorage.org/getpro/geektimes/post_images/d59/cd9/53a/d59cd953ac3467ac2d772d06c80b5257.jpg)
Как видно на скрине в открывшемся окне в правом верхнем углу разворачиваем список опций и выбираем Edit Output Settings и в выпадающем списке Settings выбираем Background image
![image](https://habrastorage.org/getpro/geektimes/post_images/659/94d/ed7/65994ded7cfcc7e7f9c382770837b06e.jpg)
Жмем ОК, окно при этом закрывается и нажимаем Preview
![image](https://habrastorage.org/getpro/geektimes/post_images/9cc/8d4/7c2/9cc8d47c28e7ce939cac24defc879d53.jpg)
В результате открывается браузер и мы видим нашу картинку в качестве фона у страницы.
![image](https://habrastorage.org/getpro/geektimes/post_images/1c3/251/873/1c3251873a845a1302c2dbca60865a84.jpg)
Конечно, белая таблица с кодом страницы мешается и я пока не нашла как от нее избавиться, но зато уже можно получить представление как будет выглядеть наш фон.