<< Chapter < Page Chapter >> Page >

This code results in the following image:

The Taj Mahal
The photograph of the Taj Mahal in this figure and the following figures was taken by Steve Evans . It is licensed for public use under the Creative Commons Attribution License.

The following CNXML code shows how to display the same image with a specific size (in this case, 250 pixels wide by 250 pixels tall):

<figure id="figure_size_adjusted"><media id="TajMahal" alt="The Taj Mahal"><image mime-type="image/jpeg" src="TajMahal_medium.jpg"height="250" width="250" /></media></figure>

The resulting figure is displayed below:

The Taj Mahal

When specifying width and height , enter the value in pixels. For example, the code above will produce a print image that is 250 pixels tall and 250 pixels inches wide.

It is not necessary to specify both the height and width of an image. If you supply only one of these, the other value will be calculated to preserve the same height-width ratio as the original image. You only need to supply both when you wish to change the shape of the image.
The height and width attributes do not affect the size of the image in the print (PDF) version of the module. To change the printed size of the image, use the print-width attribute (see below). You can use any combination of print and online sizing attributes for an image.

Adjusting the size of a printed image

You can adjust the size of the image in the print (PDF) version of your document by using the print-width attribute. The height of the image will be adjusted proportionately to the width set in print-width . There is no print-height attribute.

The following CNXML code shows how to display the Taj Majal image above with a specific printed size (in this case, 4.5 inches wide):

<figure id="figure_size_adjusted"><media id="TajMahal" alt="The Taj Mahal"><image mime-type="image/jpeg" src="TajMahal_medium.jpg"print-width="4.5in" /></media></figure>
The print-width attribute does not affect the size of the image when viewing the version of the module. To change the online size of the image, use the height and width attributes. You can use any combination of print and online sizing attributes for an image.

Creating a linked thumbnail image

A thumbnail is a small version of an image that, when clicked, displays the larger, full-size version of that image. You can create a thumbnail in your modules by completing the following steps:

  1. Using image-editing software, create a thumbnail-sized version of your image file. Make sure to change the name of the thumbnail image so that you know which is which (e.g. "myimage_thumb.png").
  2. Add the thumbnail image to your module using the files tab as you would with any image fie.
  3. Create the media and image elements as you would normally do for a full-sized image.
  4. Use the optional thumbnail attribute to the image element as shown in the example below.
Here is an example of the CNXML code required to include a thumbnail image that links to a full size version: <figure id='thumbnail'><media id="thumbnailmedia" alt="The Taj Mahal (thumbnail version)"><image mime-type='image/jpeg' src='TajMahal_medium.jpg'thumbnail='TajMahal_Thumb.jpg'/></image></media></figure> This code results in the following linked image:
The Taj Mahal (thumbnail version)

Questions & Answers

How we are making nano material?
what is a peer
What is meant by 'nano scale'?
What is STMs full form?
scanning tunneling microscope
what is Nano technology ?
Bob Reply
write examples of Nano molecule?
The nanotechnology is as new science, to scale nanometric
nanotechnology is the study, desing, synthesis, manipulation and application of materials and functional systems through control of matter at nanoscale
Is there any normative that regulates the use of silver nanoparticles?
Damian Reply
what king of growth are you checking .?
What fields keep nano created devices from performing or assimulating ? Magnetic fields ? Are do they assimilate ?
Stoney Reply
why we need to study biomolecules, molecular biology in nanotechnology?
Adin Reply
yes I'm doing my masters in nanotechnology, we are being studying all these domains as well..
what school?
biomolecules are e building blocks of every organics and inorganic materials.
anyone know any internet site where one can find nanotechnology papers?
Damian Reply
sciencedirect big data base
Introduction about quantum dots in nanotechnology
Praveena Reply
what does nano mean?
Anassong Reply
nano basically means 10^(-9). nanometer is a unit to measure length.
do you think it's worthwhile in the long term to study the effects and possibilities of nanotechnology on viral treatment?
Damian Reply
absolutely yes
how to know photocatalytic properties of tio2 nanoparticles...what to do now
Akash Reply
it is a goid question and i want to know the answer as well
characteristics of micro business
for teaching engĺish at school how nano technology help us
How can I make nanorobot?
Do somebody tell me a best nano engineering book for beginners?
s. Reply
there is no specific books for beginners but there is book called principle of nanotechnology
how can I make nanorobot?
what is fullerene does it is used to make bukky balls
Devang Reply
are you nano engineer ?
fullerene is a bucky ball aka Carbon 60 molecule. It was name by the architect Fuller. He design the geodesic dome. it resembles a soccer ball.
what is the actual application of fullerenes nowadays?
That is a great question Damian. best way to answer that question is to Google it. there are hundreds of applications for buck minister fullerenes, from medical to aerospace. you can also find plenty of research papers that will give you great detail on the potential applications of fullerenes.
what is the Synthesis, properties,and applications of carbon nano chemistry
Abhijith Reply
Mostly, they use nano carbon for electronics and for materials to be strengthened.
is Bucky paper clear?
carbon nanotubes has various application in fuel cells membrane, current research on cancer drug,and in electronics MEMS and NEMS etc
While the American heart association suggests that meditation might be used in conjunction with more traditional treatments as a way to manage hypertension
Beverly Reply
Got questions? Join the online conversation and get instant answers!
Jobilize.com Reply

Get the best Algebra and trigonometry course in your pocket!

Source:  OpenStax, Ideas and tools for improving connexions modules and collections. OpenStax CNX. Mar 22, 2010 Download for free at http://cnx.org/content/col11184/1.2
Google Play and the Google Play logo are trademarks of Google Inc.

Notification Switch

Would you like to follow the 'Ideas and tools for improving connexions modules and collections' conversation and receive update notifications?