Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

68 lines (49 sloc) 1.657 kb
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>&lt;img&gt; elements</title>
<style type="text/css">
html { -pie-load-path: "../build"; }
img {
border-radius: 40px;
behavior: url(../build/PIE_uncompressed.htc);
border: 0;
position: relative;
}
#shadow {
-webkit-box-shadow: 0 0 10px red;
-moz-box-shadow: 0 0 10px red;
box-shadow: 0 0 10px red;
}
#pngfixCont {
padding: 10px;
background: url(background1.gif);
}
#pngfix {
border-radius: 0;
-pie-png-fix: true;
}
</style>
</head>
<body>
<h1>Images</h1>
<h2>Rounded corners</h2>
<img src="photo.jpg" />
<h2>Rounded, scaled down</h2>
<img src="photo.jpg" width="320" height="240" />
<h2>Aspect</h2>
<img src="photo.jpg" width="128" height="480" />
<img src="photo.jpg" width="640" height="128" />
<h2>With shadow</h2>
<img src="photo.jpg" id="shadow" width="320" height="240" />
<h2>In link (should remain clickable)</h2>
<a href="#" onclick="alert('clicked'); return false;"><img src="photo.jpg" width="320" height="240" /></a>
<h2>With border</h2>
<img src="border.png" style="border:10px solid red;" />
<h2>With padding</h2>
<img src="border.png" style="border:10px solid red; padding: 5px;" />
<h2>Rollover</h2>
<img src="icon-safari.png" onmouseover="this.src='icon-chrome.png'" onmouseout="this.src='icon-safari.png'" />
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.