2013-08-22 4 views
3

Не удари меня слишком рано!Как вставить изображение на HTML-страницу?

Я знаю, как добавить изображение в HTML-страницу ... Но я хочу добавить фактический файл изображения на этой странице HTML.

Там, я хочу, чтобы моя html-страница была автономной, без какой-либо папки или файла. Например, я помещал css в лайнер <style>. Теперь я хотел бы сделать то же самое с изображением.

Первый вопрос: возможно ли это?

Второй вопрос: может ли импортированный файл изображения быть добавлен несколько раз в HTML?

Я не знаю, если я понятно, так, есть пример того, что я хочу:

<html> 
    <head> 
     <file byte="A02AB46213F541F...ABCD542" ref="my_ref" /> 
    </head> 
    <body> 
     <img src="my_ref" /> 
    </body> 
</html> 
+3

Эта ссылка говорит вам, как это сделать: http://sveinbjorn.org/news/2005-11-28-02-39-23/Embedded-image-data-in -HTML-documents.html – edtheprogrammerguy

+0

Большое спасибо! Вы ответили на мой первый вопрос. Теперь может быть здорово, если я смогу сделать ссылку на свой встроенный ресурс, потому что мне понадобится этот образ тысячу раз на моей странице HTML (второй вопрос) – Marc

+0

И для второго вопроса нет, я не думаю, что это возможно с использованием URL-адресов данных , –

ответ

2

Я наконец-то нашел!

Благодаря ... Stackoverflow actualy ^^

solution я нашел очень просто. Просто используйте URL-адрес данных в css! Итак, теперь мой html-код действительно не читается, но html-файл действительно прост!

EDIT: я хоть немного примеров может быть большим для любых других:

<html> 
    <head> 
     <style> 
      .myImage 
      { 
       background-image: url("data:image/png;base64,iVBORw0KG...ggg=="); 
       background-repeat: no-repeat; 
       background-position: center; 
      } 
     </style> 
    </head> 
    <body> 
     <div class="myImage"> 
     </div> 
    </body> 
</html> 
0

Вы также можете поместить данные в атрибуте ГКЗ в IMG тега.

<IMG src="data:image/png;base64,iVBORw0KGg....ggg==">

Смежные вопросы