Specify Web page DOCTYPE solution CSS Hacking Method Summary _ Experience Exchange

Source: Internet
Author: User
But in fact, the browser is far more than these, Firefox is divided into Firefox 1.5,firefox 2,firefox 3 Several major versions, IE7,IE6 also have several series, in addition to the two mainstream manufacturers of products, as well as opera, Konqueror,netscape,chrome and other series.

These browsers, each has its own set, often in this operation is normal, where the operation is not normal. So the WD tore east to make up the West, finally can in several browsers are normal. As a result, the product manager has a new demand, where to change where, so, not easy to fool the paper shelves collapsed suddenly, the WD are busy. That's why, because it's my experience.

Usually WD, always collect a bunch of CSS Hacking skills, in order to be normal in each browser. A search on the internet, a lot of.

However, first WD did not understand a basic problem, why do we need CSS Hacking? If there are 1000 kinds of browsers, do we have to remember the hack skills of 1000 kinds of browsers?

In fact, Css hacking to some extent, is a thing that does not take the stage face. Css hacking has a lot of tricks, just to make use of the browser bugs. For example, the common use of _class{...} to distinguish between IE and Firefox, is arguably _class is an illegal method of marking. The appearance of Css hacking, is WD are compelled to, WD's daily work is not crazy CSS Hack.

In fact, so many browsers, not be able to casually, want to define what they define a mark. People are used to living in a standard world, in the web world, there are a series of standards. Browsers are also trying to make Web standards compatible. But some browsers started early, and they could say that the web standards that appeared later were born under their influence. There is another, that year is very cow B, so do a lot of innovation, do not put the web standards in mind, quite don't care. Moreover, the standard itself is constantly updated. Therefore, the General browser product system has been a period of no care about the Web standards of the day, and then everyone realized that, we all compromise, we have to formulate a set of standards, we all adhere to. However, before the various families have their own formulation of a number of small boxes, they do not meet the standard, how to do?

So, these people think of a way: Standard mode and weird mode. There is also a kind of, called "near Standard mode", almost standard. It's weird enough to say, I'm all ears. Don't worry, listen to me slowly.

Did not say, these bosses sit together, set up a variety of standards, in the future, everyone according to this set of standards to explain the page. If you make a Web page that can be interpreted according to this set of criteria, use a tag doctype to indicate that it can be interpreted according to Web standards. This is Standard mode.

That before the various families have produced, stipulated the small 99 do not meet the standard, how to do ah? And you can't just throw them all away. Software is probably a set of principles, called backward compatibility. In weird mode, browsers simulate the operations of older browsers to prevent old pages from working. When a Web page does not specify DOCTYPE, the browser generally works in a weird mode to prevent the old page from working.

The most notable example of the difference between the two modes is the proprietary box model for IE on Windows. When IE 6 appears, use the correct box model in standard mode and use the old proprietary box model in weird mode. To maintain backward compatibility with IE 5 and lower versions, Opera 7 and later also used the flawed IE box model in weird mode.

Mozilla and Safari also have a third model, called "Almost Standard mode" (Almost standards mode), which is the same pattern as the standard mode, except for some subtle differences in how tables are handled.

That's why you can throw away a lot of CSS hacking tricks. Some books say that IE6 and Firefox's box model (or some place called the box model) are inconsistent, and therefore need to do so hack:

div{
width:100px;
*width:95px;
}

I said, this kind of book is really fraught. Because, as long as the DOCTYPE is correctly specified, the differences in these browser interpretations do not exist, and we follow the criteria.

This pattern is specified by the DOCTYPE field at the beginning of the HTML file. These are the common types:

HTML 4.01 Transitional:
Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "HTTP://WWW.W3.ORG/TR/HTML4/LOOSE.DTD" >


HTML 4.01 Frameset

Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 frameset//en" "HTTP://WWW.W3.ORG/TR/HTML4/FRAMESET.DTD" >


XHTML 1.0 Strict

Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >


XHTML 1.0 Transitional

Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">


XHTML 1.0 Frameset

Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 frameset//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd" >

XHTML 1.1

Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//w3c//dtd XHTML 1.1//en" "Http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" >

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.