Skip navigation
Currently Being Moderated

DOCTYPE

Jul 13, 2012 11:06 AM

Dear All,

I am visited some international website all website mentioned below mentioned code,

What is it? How is working, what is the foundamental for using?

 

 

<!DOCTYPE html>

<!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" version="XHTML+RDFa 1.0" dir="ltr"

  xmlns:og="http://ogp.me/ns#"> <![endif]-->

<!--[if IE 7 ]>    <html class="ie7" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" version="XHTML+RDFa 1.0" dir="ltr"

  xmlns:og="http://ogp.me/ns#"> <![endif]-->

<!--[if IE 8 ]>    <html class="ie8" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" version="XHTML+RDFa 1.0" dir="ltr"

  xmlns:og="http://ogp.me/ns#"> <![endif]-->

<!--[if IE 9 ]>    <html class="ie9" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" version="XHTML+RDFa 1.0" dir="ltr"

  xmlns:og="http://ogp.me/ns#"> <![endif]-->

<!--[if (gt IE 9)|!(IE)]> <html class="no-js" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" version="XHTML+RDFa 1.0" dir="ltr"

  xmlns:og="http://ogp.me/ns#"> <![endif]-->

 
Replies
  • Currently Being Moderated
    Jul 13, 2012 11:10 AM   in reply to manojb05

    Looks like conditional statements for browser detection. Here's a link on what this does:

     

    http://www.positioniseverything.net/articles/cc-plus.html

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 13, 2012 11:57 AM   in reply to manojb05

    They're not links to Facebook, but namespace declarations. It means that the site is using attributes that begin with "fb:". The namespace declaration simply tells the browser that attributes beginning with "fb:" are related to Facebook.

     

    There's only one Doctype in that list. The rest are opening <html> tags that contain a class identifying the version of Internet Explorer. It's a technique that makes it possible to serve special styles to handle bugs or other problems in old versions of IE.

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 13, 2012 5:23 PM   in reply to manojb05

    I used to start my document with (or similar)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    Sometimes I would have need to slighly adjust the margins in older IE browsers. I would use the style rule exception as in

    <!--[if lt IE7]>

    .box { 

       padding-top: 3px

    <![endif]-->

    I could finish up with a whole heap of exceptions that were very hard to follow.

     

    Now I start my document with

    <!doctype html>

    <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->

    <!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->

    <!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->

    <!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

    In the above, we have our doctype

    <!doctype html>

    and our html element

    <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->

    <!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->

    <!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->

    <!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

    This looks a lot more complicated than it really is. We’re doing a few conditionals here which means we’ll serve an html element with different classes depending on what browser people are using. So for example, if someone using IE7 visits the page (God, help them), the html element will look like this (also dependent the language):

    <html lang="en" class="no-js ie7 oldie">

    The oldie class is so you can do specific styling on older browsers. So let’s say you have an element that needs a bit of extra padding on top in older versions of IE because it looks off. In your CSS you could have something like this:

     

    .box { padding: 0; }

    .oldie .box { padding-top: 3px; }

     

    Only “oldie” browsers would see that extra padding. You could also use the “ie7″ class if you wanted to narrow it down even further.

     

    The no-js class is used in the same way and is used just in case you want to style things when users have javascript turned off.

     

    Gramps

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points