简单的响应布局与旋转木马表带

Question

我正在努力想出一个响应式布局，似乎是围成一圈！任何人都可以指向一个好的教程或一些例子来试图实现这个目标......

中心带将用于水平转盘，最大高度为500px。徽标和页脚将分别为100px。

在平板电脑或手机上观看时，我只是希望它看起来像在桌面上一样，标志和页脚可见，中央表带更小，以适应。

有人可以帮忙吗？

Answer 1

我建议使用Bootstrap - 他们有一些非常易于使用的样式，可以帮助您按照自己的喜好设计自己的网站。

Answer 2

这样的事实际上很难实现！

查看我放在一起的快速码本：http://codepen.io/seanwash/pen/eKjnz/

基本上，您可以在滑块的容器上设置最大高度，以确保它永远不会高于500px。通过在图像上设置max-width: 100%，我们确保在浏览器缩小时滑块会缩小。

对于响应式滑块，我会查看http://www.woothemes.com/flexslider/之类的内容，因为它的响应能力很强。我自己使用了Flexslider多次，它总是很棒！

Answer 3

如果您不想自己制作滑块，只需将其用于开箱即用，则iview和flex滑块以及其他许多工作。