Just know what CSS hack is today.

First, a cold joke: a night from work home, a police head-on patrol. Suddenly shouted to me: Stop! Civilian police: How many bytes does the int type occupy? Me: 4. Policeman: You can go now. I am very surprised. Me: Why do you ask such a question? Police: Late at night still walking in the street, shabby hard-pressed appearance, not a thief is a programmer

As a back-end programmer, the previous knowledge of the CSS is fur, because there is a professional art to help us do static pages, we only need to do a good job of filling the page data, focus on writing logic code. Now there is a want to engage in web front-end development, although know some of the main concepts of JS, prototype, prototype chain, context, closures and the like, but it seems to be not very deep, think or start from the CSS, sometimes very simple some style is always very painful to write. So today I read the CSS manual, a bit of accumulation it.

What is CSS hack

My own understanding of the definition, that is, for the different browsers in the analysis of certain CSS properties when the difference occurs, we go to coding css These differences in the process. Look at the CSS hack know there's

1. Condition hack

1 <!--[if <keywords>? IE <version>?] >2    HTML code block 3<![ Endif]-->

<keywords>取值有
　　空
　　lt   小于
　　gt　 大于
　　gte  大于或等于
　　lte  小于或等于
　　！   非
<version>取值有
可以是6/7/8/9...
例如 以下表示浏览器是小于ie7的：

1 <!--[if Lt IE 7]> 2 <style> 3     . test2{width:100px;  Height:100px; background:Blue}4</style>5<![ Endif]-->

以下例子是ie7的，这个是有效果的:

<!--[if IE 7]><style>    . Test{color:red;} </style><! [endif]-->

2. Attribute-level hack
The code is as follows:

#test{Color:#c30;/*For Firefox*/Color:red\0;/*For Opera*/Color:yellow\9;/*For ie8+*/*color:Blue;/*For IE7*/_color:#ccc;/*For IE6*/}

3. Selector level hack

* HTML. Test{Color:#090;}/*For IE6 and earlier*/* + HTML. Test{Color:#ff0;}/*For IE7*/. Test:lang (ZH-CN){Color:#f00;}/*For ie8+ and not IE*/. Test:nth-child (1){Color:#0ff;}/*For ie9+ and not IE*/

Also a little bit of knowledge is to let an inline element can be set to wide-height currently known to have Display:block/inline-block or set position:absoulte or set float, etc.
At last      

I'm always busy during the day
I always panicked at night.
They say there's light in front.
Who can give directions to who?
Looks like he and she seem to be in a good scene.
To admit that small is not as strong to play

Ask yourself every day
Do you do your best
Do not learn a variety of scheming
Process is reward
You've been standing where the light shines
Just believe in yourself and everyone is the same

One more person to share with you
A little less difficult to carry on your shoulder
We're all dumb kids, but don't forget to stand up.
One more person to share with you
A little less difficult to carry on your shoulder
Believe that you will shine and shine sooner or later

Ask yourself every day
Do you do your best
Do not learn a variety of scheming
Process is reward
You've been standing where the light shines
Just believe in yourself and everyone is the same