问题标签 [skeleton-css-boilerplate]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
5 回答
6356 浏览

css - 如何在 Skeleton Framework 中为容器添加填充?

我正在使用 Skeleton Framework (http://getskeleton.com),并且我想要一个具有背景颜色和白色容器页面的页面。

如果我.container {padding:0 10px;}在调整小型设备的窗口大小时添加布局中断。希望我在这里遗漏了一些非常明显的东西。如何在不破坏响应式设计的情况下向容器添加填充?

0 投票
0 回答
335 浏览

css - 当我将页眉主要内容和页脚分开到不同的视图时,骨架样板不会正确加载?

我正在尝试在codeigniter中从getskeleton.com加载骨架CSS,我正在使用一个模板系统,我在一个视图中分离我的标题(打开html,指向CSS的链接,页面的标题),导航栏在另一个视图中,第三个视图中的主要内容,第四个视图中的侧栏,以及第五个中的页脚和关闭 html,我尝试将它们附加到控制器中的变量以加载视图,也尝试使用模板视图加载每个视图,两个系统都可以正常加载视图,后者是我在开始尝试使用骨架之前所拥有的,它可以很好地加载 css,但是没有一个系统会加载骨架 css 文件。如果我将纯 html 中的布局作为一个完整的文档正确加载,那么所有加载都很好,我做错了什么?

这就是我的观点:

这是导航:

这是主要内容:

这是侧边栏(我没有开发任何试图首先让显示正确的东西):

这是页脚:

0 投票
1 回答
466 浏览

css - 骨架列在 Firefox 顶部添加奇怪的空间

我是骨架新手,正在尝试建立一个简单的网站,但我已经遇到了 Firefox 的问题。代码非常简单,这里是:

当我使用列时,它在除 Firefox 之外的所有浏览器上都显示良好。相反,如果我使用“三分之二”作为班级,甚至“三分之二”,它会显示得很好。

这是当我使用任何列时 Firefox 所做的(图片)(它在顶部 102px 处广告了一个奇怪的空间)

如果我使用“三分之二”firefox 会再次显示正常(图片)

我查看了所有代码,但无法弄清楚发生了什么。为什么列在 Firefox 中表现不佳?如果这很重要,我在 17.0.1 上。

谢谢你的帮助。

0 投票
2 回答
405 浏览

css - 下拉菜单项隐藏在 ie8 中

在 IE8 文档模式 IE8 中,我使用了 simplethemes 的 wp-skeleton 主题,它使用了superfish的变体。除了 IE8 之外,所有浏览器似乎都可以正常工作,如下所示:

0 投票
2 回答
4196 浏览

html - 响应式设计:为什么 css 不响应手机屏幕尺寸?

我正在使用响应式 CSS 框架 Skeleton,由于某种原因,当屏幕尺寸为移动宽度时,css 没有响应移动媒体查询。

它正在响应平板媒体查询,但在屏幕进入移动设备尺寸后,它会恢复为标准 CSS 宽度。

这是我正在使用的实时站点:

http://fine-grain-2.myshopify.com/

这是我正在使用的 HTML:

这是移动媒体查询 CSS:

这是正常工作的平板电脑媒体查询 CSS:

0 投票
1 回答
1468 浏览

css - 使用骨架 css 框架时,边距出现在两个尺寸上

我刚刚安装了骨架框架来体验它。我正在使用 16 列布局,当我在 iphone 上测试它时,我发现左右两边都有边距。

有人有想法吗?

谢谢

0 投票
0 回答
585 浏览

html - 如何在小屏幕上交换 Skeleton CSS Grid 中的侧边栏?

我是使用 Skeleton CSS 网格的新手,所以请原谅我的无知!

我的问题起初看起来很简单,但它让我有点难过。

例如,我有一个网站,其左侧栏侧边栏为 4 栏宽,右侧栏内容区域跨越 12 栏。像这样的东西:

具有左侧边栏和右侧内容区域的布局示例

在较小的屏幕尺寸上,侧边栏折叠到主要内容区域的顶部。这不是我想要的……由于较小尺寸的线性特性,我希望侧边栏出现在主要区域下方,以便在更多移动设备上“首先”显示内容。

Skeleton 的默认行为是将此侧边栏堆叠在主区域的顶部。

关于这个解决方案的任何想法?我是否可以使用负边距并在语义上调整标记以将侧边栏放置在主要区域下方?

谢谢,迈克尔。

0 投票
0 回答
622 浏览

css - 骨架等高柱

Skeleton 对所有列使用 float:left 和 display:inline。我需要使我的列高度相等,但仍保持 float:left 和 display:inline 以便在浏览器窗口调整大小时它们的行为符合预期。任何想法?

0 投票
2 回答
10231 浏览

html - 骨架网格系统:使容器 100%

是否可以使根 div(容器)成为文档的 100%?
这是我的代码:

谢谢

0 投票
1 回答
1294 浏览

jquery - 带有骨架样板的 Flexslider

我正在使用带有 Skelton 样板的 flexslider 插件。但是,我无法让滑块处理大图像。理论上,滑块应该使图像符合 .flexslider 类的大小,但它只显示图像的一部分,而不是在调整视口大小时调整图像大小以适应屏幕。

我正在使用一个非常标准的 Skeleton 框架,并且丝毫没有触及 flexslider css 或 javascript。

对应的HTML如下:

当文档中没有调用 flexslider javascript 插件时,图像似乎符合容器 div 的大小,但是一旦它在那里,它似乎就不起作用了。

有什么建议么?

谢谢!