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

Editor to share with you how to use pure css to achieve div adaptive center compatible IE7 Chrome FireFox, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

1. Pure CSS, without JS at all, is a liberation for JS programmers!

2. IE7, 8 under rgba attribute will be invalid, so if you want to do translucency to add a new div, this step I am lazy to save , the point is the middle div laugh

3. For the pop-up layer, you can set z-index for your own situation. I don't have any settings here.

4. IE6 did not test, sorry =

DOM structure

The code is as follows:

Fdsfsdfsadfsdafsdafdssad

How do you feel?

Stye.css:

The code is as follows:

. pop-wrap {

Position: fixed

Top: 0

Background: rgba (0,0,0,.8)

Left: 0

Width: 100%

Height: 100%

}

. pop-wrap table {

Height: 100%

Width: 100%

}

. pop-wrap td {

Width: 100%

Height: 100%

}

Div.pop {

Margin: 0 auto

Width: 200px

Background: # ECECEC

Padding: 20px

Text-align:center

}

Div.pop p {

Font: 200 14px/20px Microsoft YaHei

}

Div.pop input {

Background: # FFFFFF

Border: 1px solid # ADADAD

Padding: 3px 10px

Border-radius: 2px

Cursor: pointer

}

The above is all the contents of the article "how to use pure css to achieve div adaptive center compatibility with IE7 Chrome FireFox". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow 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.