Shulou(Shulou.com)06/01 Report--

Most people do not understand the knowledge points of this article "how to solve common CSS HACK problems", so the editor summarizes the following content, detailed content, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "how to solve common CSS HACK problems" article.

The following are common CSS HACK problems and remediation codes-DIV+CSS net support

1. Block the IE reader (that is, it does not appear under IE)

*: lang (zh) select {font:12px! important;} / * Special use of FF * /

Select:empty {font:12px! important;} / * safari visible * /

Here select is the selector, changing according to the environment. The second sentence is exclusive to the safari dabbler on MAC.

2. Only IE7 recognizes hack

* + html {… }

Privately, when the demand is only for IE7, you can accept this HACK.

3. Identify CSS HACK under IE6 and IE6

* html {… }

Pay special attention to this place. The landowners have written that it is IE6's HACK. Indeed, IE5.x can also recognize this HACK. The other browsers are not recognized.

Html/**/ > body select {. }

The probation communication between this sentence and the previous sentence.

4. Only IE6 does not recognize div hack

Select {display / * IE6 does not recognize * /: none;}

Here is mainly through the CSS section annexation of an attribute and value, interpretation in front of the colon.

5. Only IE6 recognition is supported.

.yangshi {_ height:20px;}

Here IE6 is in favor of identifying the "_" short underscore before the CSS attribute.

6. Only IE6 and IE5 are not recognized.

Select/**/ {display / * IE6,IE5 does not recognize * /: none;}

What is consistent with the following sentence is the addition of a CSS expression between the resolution and the curly braces.

7. Only IE5 does not recognize

Select/*IE5 does not recognize * / {display:none;}

The text of this sentence is removed from the attribute area in the previous sentence. As long as the IE5 does not recognize

8. The box model is greedy for the door path.

Selct {width:IE5.x width; voice-family: "\"}\ ""; voice-family:inherit; width: exact width;}

The method of removing the box model is not the end! important will deal with it. This should be appreciated.

9. Clean up the float

Select:after {content: "."; display:block; height:0; clear:both; visibility:hidden;}

In Firefox, when the children are floating, then the height of the parent can not completely cover the whole child, so use this floating HACK to define the parent once, then you can manage the problem.

10. Truncation ellipsis

Select {- oMut _ text _ over _ flow _ rides; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}

This is a good craftsmanship that will truncate more than part of the text after exceeding the length, and end with an ellipsis. It's just that Firefox doesn't approve at the moment.

11. Only Opera recognizes

@ media all and (min-width: 0px) {select {. }}

Make individual settings for Opera dabblers.

The above usually write some HACK in CSS, these are usually used to handle local compatibility issues, if you are eager to bring out compatibility patterns, you might as well try the following filters. Some of these filters are written in CSS to import other styles through filters, and some are written in HTML to link to important patching patterns.

12. If premise Hack of IE

All IE recognizable

Only IE5.0 can recognize it.

IE5.0 package or IE5.5 can be recognized.

Only IE6 can recognize

Both IE6 and IE6 are recognizable by the following IE5.x

Only IE7 can recognize

13. IE8 compatible recognition only

Div {height:20px\ 9;}

In the "\ 9" here, only IE8 agrees to identify the above article on "how to solve common CSS HACK problems". I believe we all have a certain understanding. I hope the content shared by the editor will be helpful to you. If you want to know more about the relevant knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.