image_tag(source, options = {})
Returns an html image tag for the source. The source canbe a full path or a file that exists in your public images directory.
Options
You can add HTML attributes using the options. Theoptions supports three additional keys for convenience andconformance:
- :alt - If no alt text is given, the file name part of thesource is used (capitalized and without the extension)
- :size - Supplied as "{Width}x{Height}", so"30x45" becomes width="30" and height="45".:size will be ignored if the value is not in the correct format.
- :mouseover - Set an alternate image to be used when theonmouseover event is fired, and sets the original image to be replacedonmouseout. This can be used to implement an easy image toggle that fireson onmouseover.
Examples
image_tag("icon") # => <img src="/images/icon" alt="Icon" /> image_tag("icon.png") # => <img src="/images/icon.png" alt="Icon" /> image_tag("icon.png", :size => "16x10", :alt => "Edit Entry") # => <img src="/images/icon.png" width="16" height="10" alt="Edit Entry" /> image_tag("/icons/icon.gif", :size => "16x16") # => <img src="/icons/icon.gif" width="16" height="16" alt="Icon" /> image_tag("/icons/icon.gif", :height => '32', :width => '32') # => <img alt="Icon" height="32" src="/icons/icon.gif" width="32" /> image_tag("/icons/icon.gif", :class => "menu_icon") # => <img alt="Icon" class="menu_icon" src="/icons/icon.gif" /> image_tag("mouse.png", :mouseover => "/images/mouse_over.png") # => <img src="/images/mouse.png" οnmοuseοver="this.src='/images/mouse_over.png'" οnmοuseοut="this.src='/images/mouse.png'" alt="Mouse" /> image_tag("mouse.png", :mouseover => image_path("mouse_over.png")) # => <img src="/images/mouse.png" οnmοuseοver="this.src='/images/mouse_over.png'" οnmοuseοut="this.src='/images/mouse.png'" alt="Mouse" />一般用于 view 层