Sample Styles for UNCW web pages

Images without captions

photoRight

To the right, is an image with the class of "right".

The text will flow around it. Just select it and choose "right" from the style drop-down menu.

photoLeft

To the left, is an image with the class of "left".

The text will flow around it. Just select it and choose "left" from the style drop-down menu.

 

Images with captions

photo

Caption text here.

Left

To the left is a captioned photo. The text will flow around it.

To use, copy the code below. Then in Contribute, choose Insert > HTML Snippet from the top menu. Paste the code in the box and click OK. You can then edit the photo by right clicking on it and edit the caption text. Don't forget to edit the alt text for the photo.

<div class="photoboxLFT"><img src="images/img.jpg" alt="photo" />
<p>Caption text here.</p></div>
    
photo

Caption text here.

 

Right

To the right is a captioned photo. The text will flow around it.

To use, copy the code below. Then in Contribute, choose Insert > HTML Snippet from the top menu. Paste the code in the box and click OK. You can then edit the photo by right clicking on it and edit the caption text. Don't forget to edit the alt text for the photo.

<div class="photobox">
<img src="images/img.jpg" alt="photo" /> <p>Caption text here.</p></div>

Pullquotes

Below are two styles for pullquotes. To use, copy the code below the example. Then in Contribute, choose Insert > HTML Snippet from the top menu. Paste the code in the box and click OK. You can then edit quote text.

Quotes/BottomQuote - Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

<div id="bottomquote">
<p id="quotes">Text of your quote here.</p>
</div>

QuotesGreen/bottomquoteGreent - Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

<div id="bottomquoteGreen">
<p id="quotesGreen">Text of your quote here.</p>
</div>

UNC Wilmington | 601 S. College Road, Wilmington NC 28403 | 910.962.3000 | About this Site | Copyright Notice | Feedback | Page maintained by:  L. Allen[ allenl AT uncw DOT edu ]