7OK

Outils du site

La laïcité est l'acceptation de toutes les opinions et de tous les comportements qui savent respecter l'autre. L'unicité de Dieu propose par le pharaon Akhenaton est en fait la base de la laïcité. Il n'est plus question de s'entre-déchirer au nom d'une multitude de divinités, mais de constater l'unicité de l'espèce humaine dans son devenir. [Albert Jacquard]
Vous êtes ici : 7OK » Tⓞⓞls » Images
56-tools:images

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Prochaine révision		Révision précédente
56-tools:images [2015/11/18 15:42] – créée Roge56-tools:images [2017/10/06 23:38] (Version actuelle) – modification externe 127.0.0.1
Ligne 1: Ligne 1:
  
 +====== Images ======
 +
 +Encoder des images en base 64: [[http://base64online.org/encode/]]
 +
 +Il est très performant de stocker des petites images utilisées fréquement dans la feuille de style.
 +
 +<code css>
 +.ImgCollapsed {
 + width:20; height:20;
 + text-decoration: none; 
 + content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAQCAYAAAD52jQlAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC42/Ixj3wAAAOlJREFUOE+tkCESwjAQRVcgEIhKRAUSgewhEByCQyCQOI7AETgCAoFAcgQEEoFAIBCI8FOS7k8mQzIDnXnT37y/O23FGPN3NIjULGJyntEgsgJbloz3oEp5RsNnyIYLaLhU4hkNOmR5gWVQzHhGQ/gmfngPhiWeSS219xm4uecrmIKvPruUzg7uzHJ099bjqgH7Nei1jhaklu7cmSVeWgH2+aW4/L+7g/jzGxB4v6ed7YIOncCT8qjEM6mlnk1QTHjQ507X7YLIwpUfYM6lEs9oQBGcwYQLpZ7RIDJmEWM9GKRcTPLwN4y8AfxNottsD8mSAAAAAElFTkSuQmCC");
 +}
 +</code>
 +
 +usage en HTML:
 +
 +<code html>
 +<a href="#" onClick="alert('coucou');" title="Open"> <IMG CLASS="Collapsed"/> </a>
 +</code>
 +
 +[[http://jsfiddle.net/redg35ha/|Exemple fiddle]]
 +
 +On peut aussi stocker une image dans le javascript :
 +<code:js>
 +window.ImgCollapsed = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAALCAYAAABs3u23AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAYdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuNvyMY98AAACtSURBVDhPY/j//z9dMZjYcOjK/9rZO3BikDyyJkowmAAZig9A5TE0k4PBBMjAP3/+wDEDUBjG/vb1A20s/PbtKxyDLATRHz+8/P/gwT0aWQj0CcgidHz31kWcFhobG/8HYWL5IAwmQAZ+/PgWjN++eQa26OXLx2Df3bx6mjYWvnh2A2w4CIMsvHbh2P9LZ/b/P3NyF22CFGTw/r0b/h/asRwDU91CuudD+uH/DADncY0ihCIzIAAAAABJRU5ErkJggg==";''
 +</code>

Outils de la page