响应式旅游网页的底部

html

合作伙伴

---

• 途牛旅游网


• 驴妈妈旅游网


• 携程旅游


• 中国青年旅行社

旅游FAQ

---

• 旅游合同签订方式？


• 儿童价是基于什么制定的？


• 旅游的线路品质怎么界定的？


• 单房差是什么？


• 旅游保险有那些种类？

联系方式

---

• 微博：weibo.com/ycku


• 邮件：[email protected]


• 地址：江苏盐城无名路123号

客户端 | 触屏版 | 电脑版

Copyright © YCKU 瓢城旅行社 | 苏ICP备120110119号 | 旅行社经营许可证：L-YC-BK12345

footer {

background-color: #222;
clear:both;
position: relative;
top: 20px;

}

footer .top {

max-width: 1263px;
height: 280px;
margin: 0 auto;
text-align: center;

}

footer .version {

color: #777;
text-align: center;
padding: 10px 0;

}

footer .block {

width: 33.33%;
height: 320px;
display: inline-block;
color: #ccc;
text-align: left;
vertical-align: top;
display: block;
float: left;

}

footer .bottom {

padding: 15px 0;
text-align: center;
color: #777;
background-color: #000;
border-top: 1px solid #444;

}

footer h2 {

font-weight: normal;
padding: 20px 0 0 20px;
font-size: 24px;

}

footer hr {

width: 90%;
border: 1px dashed #333;

}

footer ul {

color: #666;
font-size: 18px;
text-indent: 20px;
line-height: 2;

}
.sm-visible {
display: none;
}

媒体查询
/当页面大于1200px 时，大屏幕，主要是PC 端/
@media (min-width: 1200px) {

}
/在992 和1199 像素之间的屏幕里，中等屏幕，分辨率低的PC/
@media (min-width: 992px) and (max-width: 1199px) {

}
/在768 和991 像素之间的屏幕里，小屏幕，主要是PAD/
@media (min-width: 768px) and (max-width: 991px) {

}
/在480 和767 像素之间的屏幕里，超小屏幕，主要是手机/
@media (min-width: 480px) and (max-width: 767px) {
.sm-visible {
display: block;
}
.bottom {
display: none;
}
}
/在小于480 像素的屏幕，微小屏幕，更低分辨率的手机/
@media (max-width: 479px) {
.sm-visible {
display: block;
}
#footer .bottom, #footer .version {
font-size: 13px;
}
.bottom {
display: none;
}
}

QQ截图20171207224349.png

QQ截图20171207223816.png