.
You are here: Home Template Typography Image Styles
Today isThursday,23October,2014

Welcome to HoA-REC&N

Image Styles

Preview

Normal Image

Shadow

Shadow 2

Blue Border

Grey Border

White back description

Your awesome description

Blue back description

Your awesome description

Description inside image

Your awesome description

Bubble description

Your awesome description

Border description

Your awesome description

Code

Normal Image

Normal Image Sample Code
<div class="ja-typo-img-wrap">
	<img src="/images/stories/sam-1.jpg" alt="" />
</div>

Shadow

Shadow Sample Code
<div class="ja-typo-img-wrap img-wrap-2">
	<div>
		<img src="/images/stories/sam-1.jpg" alt="" />
	</div>
</div>

Shadow 2

Shadow 2 Sample Code
<div class="ja-typo-img-wrap img-wrap-3">
	<div>
		<div>
			<img src="/images/stories/sam-1.jpg" alt="" />
		</div>
	</div>
</div>

Blue Border

Blue Border Sample Code
<div class="ja-typo-img-wrap img-wrap-4">
	<img src="/images/stories/sam-1.jpg" alt="" />
</div>

Grey Border

Grey Border Sample Code
<div class="ja-typo-img-wrap img-wrap-5">
	<img src="/images/stories/sam-1.jpg" alt="" />
</div>

White back description

White back description Sample Code
<div class="ja-typo-img-wrap img-wrap-6">
	<img src="/images/stories/sam-1.jpg" alt="" />
	<span>Your awesome description</span>
</div>

Blue back description

Blue back description Sample Code
<div class="ja-typo-img-wrap img-wrap-7">
	<span>
		<span>Your awesome description</span>
	</span>
		<img src="/images/stories/sam-1.jpg" alt="" />
</div>

Description inside image

Description inside image Sample Code
<div class="ja-typo-img-wrap img-wrap-8">
	<div>
		<div>
			<img src="/images/stories/sam-1.jpg" alt="" />
			<span>Your awesome description</span>
		</div>
	</div>
</div>

Bubble description

Bubble description Sample Code
<div class="ja-typo-img-wrap img-wrap-9">
	<img src="/images/stories/sam-1.jpg" alt="" />
	<span><span class="img-wrap-arr"></span>
		Your awesome description
	</span>
</div>

Border description

Border description Sample Code
<div class="ja-typo-img-wrap img-wrap-10">
	<img src="/images/stories/sam-1.jpg" alt="" />
	<span>Your awesome description</span>
</div>

Image Link

Image Link Sample Code
<div class="ja-typo-img-wrap img-wrap-11">
	<img src="/images/stories/sam-1.jpg" alt="" />
	<a href="#">Your awesome description</a>
</div>

Image link 2

Image link 2 Sample Code
<div class="ja-typo-img-wrap img-wrap-12">
	<img src="/images/stories/sam-1.jpg" alt="" />
	<a href="#">Your awesome description</a>
</div> 

Examples

IMG-WRAP-7 LEFT

Your awesome description

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy.

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum'..


IMG-WRAP-3 RIGHT

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy.

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.

HoA-REC&N on the social sphere

submit cv here

SUBSCRIBE TO NEWSLETTER




Quick Contact

Our Address

HoA-REC&N Headquarters, Gullele Botanic Garden - Find us on Map or Google map

(+251)(0)11 655 0226  This email address is being protected from spambots. You need JavaScript enabled to view it.  
P.O. Box 80773, Addis Ababa, Ethiopia