该网站如何实现响应式布局

时间:2012-08-08 00:36:07

标签: javascript html5 css3 twitter-bootstrap responsive-design

有人可以了解一下本网站用于响应的各种方式。特别是当您调整浏览器大小时,顶部和左侧导航如何变为下拉状态。

http://www.smashingmagazine.com

我确定这不使用twitter bootstrap。如果不利用Twitter bootstrap,它们是否有更好的方法来响应。

1 个答案:

答案 0 :(得分:6)

响应式设计的名称已经超过Twitter Bootstrap,并且原则上已经存在了更长时间。

  

他们是否有更好的方式在不利用Twitter的情况下做出响应   自举

“更好”是主观的,但有很多方法:

  • 另一个开箱即用框架
  • Media queries
  • JavaScript调整页面布局(您自己的,或类似Masonry
  • 基于宽度
  • 包装的浮动元素
  • 基于百分比的布局
  • 以上所有

您链接到的网站实际上有关于响应式设计的良好信息:http://www.smashingmagazine.com/responsive-web-design-guidelines-tutorials/

这些框架看起来很有趣: