Установка текстуры для страницы в формате GIF
body{
background:transparent;
background:url(//atmpl.ru/design/free-textures/2015/free_texture_19.gif) repeat;
}
Установка текстуры для блока в формате GIF
<style>
.block-textures-gif{
width:100%;
height:160px;
background:transparent;
background:url(//atmpl.ru/design/free-textures/2015/free_texture_19.gif) repeat;
overflow:hidden;
}
</style>
<div class="block-textures-gif"></div>
Установка текстуры для страницы в формате Data URI
body{
background:transparent;
background-repeat:repeat;
background-image:url(data:image/gif;base64,R0lGODlhHAAcALMAAMDHtVNtQVRuQo6XfI+XfI+XfVNuQo6WfMHItsHItcDItVNtQgAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAAcABwAAAT/0KSllq02zQ0sXcKCLIAyjUmlVcbImpNSuZdGEEixTZ1MEQlCQeZCoEyL2CH2iwUSiJ1AMkkmCgCC6oM4KA4IhYE0EVxVCbOIckpIPimKl+TVzBNecHI4V+hkAxpJg18ub24VYgB9gyJ5iWAaBS51X2JnQxRbYj54G0siIwgBiTNyZ1UpYyQskkExMZkbSDIwFGGDV0xQdEFACiMXJgVeA4nBL7iCnFEUEio+VtIXHgmkhB4VAUkYCGMpFQBMwIlJR24GnaJeBEtGHmEKA0NapCdJgenPsytWMelznlDgo8HAk2C3FqTDo0BLrnIxEulIoqUFRG4Cvpz5IUPXjyhdV1BgGdCsXBZTW2i8SqJGAphhKrToAOhJDrAu1gCQZLMmopUWcFRMTDciQBQdEy+d0mFNU6hLYQSeSZdkTgdwPLl90QLEzAZNRvPUsRanFLcq5UQIUrUhAgA7);
}
Установка текстуры для блока в формате Data URI
<style>
.block-textures-data_url{
width:100%;
height:300px;
background:transparent;
background-repeat:repeat;
background-image:url(data:image/gif;base64,R0lGODlhHAAcALMAAMDHtVNtQVRuQo6XfI+XfI+XfVNuQo6WfMHItsHItcDItVNtQgAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAAcABwAAAT/0KSllq02zQ0sXcKCLIAyjUmlVcbImpNSuZdGEEixTZ1MEQlCQeZCoEyL2CH2iwUSiJ1AMkkmCgCC6oM4KA4IhYE0EVxVCbOIckpIPimKl+TVzBNecHI4V+hkAxpJg18ub24VYgB9gyJ5iWAaBS51X2JnQxRbYj54G0siIwgBiTNyZ1UpYyQskkExMZkbSDIwFGGDV0xQdEFACiMXJgVeA4nBL7iCnFEUEio+VtIXHgmkhB4VAUkYCGMpFQBMwIlJR24GnaJeBEtGHmEKA0NapCdJgenPsytWMelznlDgo8HAk2C3FqTDo0BLrnIxEulIoqUFRG4Cvpz5IUPXjyhdV1BgGdCsXBZTW2i8SqJGAphhKrToAOhJDrAu1gCQZLMmopUWcFRMTDciQBQdEy+d0mFNU6hLYQSeSZdkTgdwPLl90QLEzAZNRvPUsRanFLcq5UQIUrUhAgA7);
}
</style>
<div class="block-textures-data_url"></div>
Геометрические примеры использования текстуры
Чтобы увидеть результат html & css нажмите на значёк 
в редакторе.
Текстура в виде круга
Текстура в виде эллипса
Параметры текстуры в формате GIF
- Формат
- Graphics Interchange Format (GIF)
- Размер
- 28 X 28 px
- Вес
- 426 Bytes
- Лицензия
- CC BY-SA 4.0
Параметры текстуры в формате Data URI
- Формат
- Data URI (ASCII)
- Размер
- 28 X 28 px
- Вес
- 568 Bytes
- Лицензия
- CC BY 4.0