CSS-Responsive layout instances

<style type= "Text/css" >
body{
margin:0 Auto;
min-width:1366px;
}
a{
Text-decoration:none;
Color:black;
}
a:hover{
Color:orange;
}
a:visited{
Color:black;
}
#main {
Background-image:url (img/bg.jpg);
Background-position:contain;
background-size:100%100%;
height:826px;
}

@media (device-height:568px) and (-webkit-min-device-pixel-ratio:2) {/* compatible iphone5 */
#main {
Background-image:url (img/bg1.jpg);
height:1080px;
}
#iptDown {
position:relative;
left:180px;
top:950px;
width:50%;
}
}
@media only screen and (max-device-width:480px) {
#main {
Background-image:url (img/bg1.jpg);
height:1880px;
}
#iptDown {
position:relative;
left:180px;
top:950px;
width:50%;
}
}

/*6*/
@media (min-device-width:375px) and (MAX-DEVICE-WIDTH:667PX) and (-webkit-min-device-pixel-ratio:2) {
    #main {
            Background-image:url (img/bg1.jpg);
             height:1880px;
       }
        #iptDown {
                 position:relative;
                left:180px;
                top:950px;
                width:50%;
           }
   }

/*6+*/
@media (min-device-width:414px) and (max-device-width:736px) and (-webkit-min-device-pixel-ratio:3) {    #main {
             Background-image:url (img/bg1.jpg);
             height:1880px;
       }
        #iptDown {
                 position:relative;
                left:180px;
                top:950px;
                width:50%;
           }
   }

/* Meizu */
@media only screen and (min-device-width:1080px) and (-webkit-min-device-pixel-ratio:2.5) {
 & nbsp;  #main {
             background-image: URL (img/bg1.jpg);
             height:1880px;
       }
        #iptDown {
                 position:relative;
                left:180px;
                top:950px;
                width:50%;
           }
   }

/*mate7*/
@media only screen and (min-device-width:1080px) and (-webkit-min-device-pixel-ratio:3) {
#main {
Background-image:url (img/bg1.jpg);
height:1880px;
}
#iptDown {
position:relative;
left:180px;
top:950px;
width:50%;
}
}

/*4 4s*/
@media only screen and (device-height:480px) and (-webkit-device-pixel-ratio:2) {
#main {
Background-image:url (img/bg1.jpg);
height:1880px;
}
#iptDown {
position:relative;
left:180px;
top:950px;
width:50%;
}
}
#topnav {
Float:right;
margin-right:146px;
margin-top:10px;
}
li{
Display:inline;
border-right:1px solid #736e6e;
margin-left:8px;
font-size:22px;
}
</style>

Contact me: [Email protected]

2016-7-25

14:05

CSS-Responsive layout instances