<meta http-equiv="pics-label" content='(pics-1.1 "http://www.icra.org/ratingsv02.html" l gen true for "http://www.apple.com" r (cz 1 lz 1 nz 1 oz 1 vz 1) "http://www.rsac.org/ratingsv01.html" l gen true for "http://www.apple.com" r (n 0 s 0 v 0 l 0))'>
<p>Using the HTML5 <video> element, embedding video in a webpage can be as simple as adding a single line of code. And, since <video> is a standard web page element, it can be manipulated with JavaScript and styled with CSS. You can use JavaScript to create your own video controls that match the look and feel of your website, and easily add expert effects to your video such as 3D transforms, reflections, or image masks using CSS. Together, these web technologies let you create polished effects with just a few lines of code.</p>
<p class="aboveList">In this example:</p>
<ul class="square">
<li>Video is displayed using the HTML5 <code><video></code> tag.</li>
<li>CSS3 transforms and animations change the scale and perspective.</li>
<li>Reflection is added with <code>-webkit-box-reflect</code>.</li>
<li>Video is masked with <code>-webkit-mask</code>.</li>
</ul>
<h3>Related Resources</h3>
<ul class="icons">
<li class="book"><a href="/safari/library/documentation/AppleApplications/Reference/SafariHTMLRef/Introduction.html">Safari HTML Reference</a></li>
<li class="book"><a href="/safari/library/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Introduction/Introduction.html">Safari HTML5 Audio and Video Guide</a></li>
<li class="book"><a href="/safari/library/documentation/AppleApplications/Reference/SafariJSRef/index.html">Safari DOM Extensions Reference</a></li>
<h1>You’ll need to download Safari to view this demo.</h1>
</header>
<p>This demo was designed with the latest web standards supported by Safari. If you’d like to experience this demo, simply download Safari. It’s free for Mac and PC, and it only takes a few minutes.</p>
<li class="promo"><h3>Preparing Your Web Content for iPad</h3>
<p><a href="http://developer.apple.com/safari/library/technotes/tn2010/tn2262.html">Learn how to make your website look and work great on iPad.</a></p>
<p class="cheat"><a href="http://webkit.org/">Developed by Apple, WebKit is the most advanced browser engine, drawing the web pages you see in Safari.</a></p>
<p class="gf-buy">Shop the <a href="http://www.apple.com/store/">Apple Online Store</a> (1-800-MY-APPLE), visit an <a href="http://www.apple.com/retail/">Apple Retail Store</a>, or find a <a href="http://www.apple.com/buy/locator/">reseller</a>.</p>