The HTML 5 and CSS 3 thread!

03-08-2012, 11:08

HTML 5 is still under active development. The sooner the better for standardisation, but many web browsers already support many of the new major features that are drafted for HTML 5 - one of which being the ability to embed videos without requiring any additional browser plugins by the use of the <video> tag. The <video> tag is supported by Internet Explorer 9 and above, Firefox 4 and above, Opera 10.6 and above, Google Chrome 6 and above and Apple Safari 5 and above. However, certain browsers only support certain video formats.

HTML5 Video Formats

MP4 - Safari, Chrome and Internet Explorer 9

WebM - Firefox, Chrome and Opera

Ogg - Firefox, Chrome and Opera

Some other great new features hopefully to be seen in the standardised version of HTML 5 include:

Simpler Doctype Declaration
The doctype declaration in HTML5 is this:

HTML Code:

<!DOCTYPE html>

Presentational HTML elements found in HTML 4.01 Transitional have been dropped entirely in HTML 5 including <font> and <s> - even though they are deprecated in HTML 4.01 Strict.

Some other new HTML 5 elements include <header>, <nav> and <footer>, which are purely structural HTML elements and have no materialistic differences to other structural HTML elements such as <div>.

CSS Gradients
Although CSS gradients are also supported by most major web browsers, because CSS 3 is not a standardised specification yet, many web browsers have their own properties for creating CSS gradients such as -webkit-linear-gradient for Webkit-based browsers including Safari and Chrome, -ms-linear-gradient for Internet Explorer and -moz-linear-gradient for Firefox. For older versions of Internet Explorer, you have to make use of the proprietary CSS filter property that is specific to IE - filter: progid: DXImageTransform.Microsoft.gradient - although the current CSS property for linear gradients in draft CSS specification is linear-gradient (for specifying linear gradients specifically).