Before HTML5 found, we normally used to detect the browser type in certain ways. We use javascript function to identify the browser version and bind some defined element to the HTML DOM and apply CSS based on created element.
Traditional approach:
<body class="js created element with browser version (ie8 bodyclass) ">
We call CSS as follows
.ie8 .bodyclass{background-color:#00ff00;}
But as now we have new technology to directly identify the browser and apply CSS, it is pretty straight forward and easy to use. When it comes to DOM manipulation the time is very short and faster approach.
HTML5 approach:
Here is the way to detect the browser version and apply CSS
<!DOCTYPE html>
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--> <html class=no-js lang=en> <!--<![endif]-->
We can easily track or identify the browser version using above HTML, so we can apply relevant styles using CSS for required browser type.
.lt-ie8 .bodyclass{background-color:#00ff00;}
.lt-ie9 .bodyclass{background-color:#ffff00;}
No comments:
Post a Comment