DataPluginImage

include an image into a page

Created by: laetzer, Last modification: 26 Aug 2006 (17:53 UTC)

Plugin: IMG

When using IMG the image and the description are enclosed with a DIV, that you can style with various CSS parameters:
  • border
  • padding
  • height
  • float
  • color
  • background
  • border
  • text-align

Example

include an image and control various parameters


    { img
        src="http://www.bitweaver.org/storage/images/logo.png"
        margin="10px 20px"
        background="#f60"
        text-align="left"
        color="#fff"
        desc="bitweaver logo"
        border="3px solid #000"
        font="bold small-caps 160%/160% fantasy"
        link="http://bitweaver.org"}


Result

result of the inclusion


    <div class="img-plugin" style="margin:10px 20px;background:#f60;text-align:left;color:#fff;border:3px solid #000;font:bold small-caps 160%/160% serif">
        <a href="http://bitweaver.org">
            <img alt="bitweaver logo" title="bitweaver logo" src="http://www.bitweaver.org/storage/images/logo.png" style="" />
        </a>


        bitweaver logo
    </div>


Notes

  • Please keep in mind that in the examples a space is added after the curly bracket to prevent the tag from being parsed (on this page). In actual use, that additional space must be removed.
  • Of course, the class of the DIV surrounding the image might still have an impact on rendering. In the example above, the class="img-plugin" could add more styling.