基金会断点

时间:2014-01-04 02:57:13

标签: responsive-design zurb-foundation

我正在研究基础框架并下载文件。我注意到为“小”“中”“大”等定义了断点。

有没有办法添加额外的断点?具体来说,我想为“小”包括的尺寸定义更多尺寸,例如手机和平板电脑的尺寸垂直和水平。

有没有比仅添加更多媒体查询更好的方法: http://foundation.zurb.com/docs/media-queries.html

我没有使用saas,只是使用直接的CSS并在我的类覆盖和自定义CSS中添加custom.css文件。

2 个答案:

答案 0 :(得分:2)

基金会将这些尺寸设置为(或多或少)手机,平板电脑,台式机。我们的想法是网站设计在这些边界内是灵活的,因此适用于任何规模。

你不可避免地需要调整奇怪的设计元素,使其看起来非常适合某些尺寸。添加您自己的媒体查询以定位这些内容。

答案 1 :(得分:2)

你可以添加你想要的任何代码,覆盖基础代码,我个人认为Zurb的方法非常好:

  • 小:适用于智能手机
  • 中:适用于平板电脑
  • 大:对于桌面

请记住,基金会的最新版本是"移动优先" ,因此如果某个行为定义为small,则假定为其他两个级别,如果未被覆盖。

正如我所说的,你可以添加你的代码...只是要小心覆盖正确...你不需要编辑SASS或者在基础的胆量上弄脏,只需添加你的平原CSS代码(在基础之后调用它)