Summary of CSS hacking solution for doctype of specified webpage

Source: Internet
Author: User

But in fact, there are far more than these browsers. Firefox is divided into Firefox 1.5, Firefox 2, Firefox 3, and IE7 and IE6, in addition to the products of these two mainstream manufacturers, there are also a series of products such as opera, Konqueror, Netscape, and chrome.

These browsers have their own set. They often run normally here, but they do not. As a result, the WD split the East Side to fill the West, and finally they could work normally in several browsers. As a result, the product manager had a new demand, where to change it. So, the dirty paper Shelf collapsed, and the WD was very busy. This is because it is my experience.

Where we are WD, we always collect a bunch of CSS hacking skills to make them work in various browsers. There are a lot of searches on the Internet.

But first, why do we need CSS hacking? If there are 1000 browsers, do we need to remember the hack skills of 1000 browsers?

In fact, CSS hacking is, to some extent, a thing that cannot be achieved. CSS hacking has a lot of skills. It simply uses browser bugs. For example, common _ class {....} To distinguish ie from Firefox, it is reasonable to say that _ class is an illegal marking method. The appearance of CSS hacking is a last resort for WD, and their daily work is not crazy about CSS hack.

In fact, there are not so many browsers that you can define a tag if you want to define a tag. People are used to living in a standard world. There are also a series of standards in the web world. Browsers also strive to achieve Web Standard compatibility. However, some browsers came out early, so the web standards that emerged later came into being under their influence. Another one is that it was very cool, so I made a lot of innovations and didn't care about web standards. Moreover, standards are constantly updated. Therefore, generally, browser product systems have never been very concerned about web standards for a while. Later, everyone realized that they were not able to do so. We all had to compromise and develop a set of standards that everyone would follow. However, in the past, all families had their own small boxes. What should they do if they did not meet the standards?

So these people thought of a way: standard mode and weird mode. There is another kind, called "almost standard mode", almost standard. It's really weird to say, and I'm dizzy. Don't worry. Let me hear it.

Didn't you say that? These bosses sat together and developed various standards. In the future, everyone will follow these standards to explain the web pages. If your webpage can be explained according to this set of standards, you can use a mark doctype to indicate that this can be explained according to web standards. This is the standard mode.

What should I do if all the products have been produced before and the rules of the 9th and 9th companies do not comply with the standards? They can't be thrown away immediately, right? Software has such a set of principles as backward compatibility. In the weird mode, all browsers simulate the operations of older browsers to prevent the old pages from working. When no doctype is specified for a webpage, browsers generally work in weird mode to prevent the old page from working.

For the differences between the two modes, the most notable example involves the Windows ie proprietary box model. When IE 6 appears, the correct box model is used in the standard mode, and the old-fashioned box-specific model is used in the weird mode. To maintain backward compatibility with IE 5 and earlier versions, opera 7 and later also use the defective ie box model in the weird mode.

Mozilla and Safari also have a third mode called "almost standard mode (almost standards mode)". Apart from slight differences in the way tables are processed, this mode is the same as the standard mode.

For this reason, you can lose a lot of CSS hacking skills. Some books describe that the box models of IE6 and Firefox are inconsistent (or some are called box models), so we need to do hack:

Div {
Width: 100px;
* Width: 95px;
}

I said, this book is really a mistake. Because, as long as doctype is correctly specified, the differences in the interpretation of these browsers will not exist, and we will follow the standard.

This mode is specified by the doctype field at the beginning of the HTML file. The following are common examples:

HTML 4.01 transitional:CopyCodeThe Code is 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 The Code is 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 The Code is 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 The Code is 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 The Code is 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.1

Copy code The Code is 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.