bone骨骼转换为cs骨骼
Dave Gamache的Skeleton Boilerplate为快速，可靠地构建响应式网站提供了完美的基础。 最近，我们将使用Skeleton并根据Webdesigntuts +上的Magazine设计构建响应页面。 我们将研究从多个背景图片到媒体查询，灵活的媒体和适合移动设备浏览的所有内容。 让我们开始吧！
第一步
在第一个视频中，我们将下载Skeleton Boilerplate并准备我们的项目。 我们将深入研究.psd布局，并拍摄我们认为必要的任何图像，为诸如徽标之类的东西创建一个sprite文件。
结构和列
现在是时候陷入标记和某些样式中了。 在本视频中，我们将检查设计的结构，并使用Skeleton的标记将其转换为HTML。 我们将使用样板提供的网格系统，并在页面中列出一些列。
我们还将通过在某些区域使用CSS多个背景图像来处理一些美学问题。
多个背景图片
浏览器对多个背景图像的支持非常好，Mozilla Firefox（3.6 +），Safari / Chrome（1.0 / 1.3 +），Opera（10.5+）甚至Internet Explorer（9.0+）都可以很好地协作。
不幸的是，不支持的浏览器无法理解规则，因此根本不会显示任何内容。 因此，建议使用适当的回退，例如，通过实现Modernizr并声明专门针对违规浏览器的附加background规则。 骨架通过在<html>标记上使用条件注释来解决此问题。 如果在Internet Explorer 8或更早版本中查看过，则将为其分配“ ie”类。 因此，您可以使用以下类似方式专门针对这些浏览器：
/*ie multiple background image fallbacks*/
.ie .band.navigation {
background: url(../images/bg_dark.png) repeat left 2px #343434;
}
.ie .band.footer {
background: url(../images/bg_dark.png) repeat left 2px #343434;
}
.ie .band.bottom {
background: url(../images/bg_bottom.png) repeat #343434;
}其他资源
到目前为止，视频中提到了以下几点：
- 相当关键的骷髅样板 。
- 有关视口元标记的更多信息。
- 多种背景的教程
- 杂志设计的PSD源文件。
- 保罗·爱尔兰（Paul Irish）的* {box-sizing：border-box} FTW 。
- 精彩的LiveReload
bone骨骼转换为cs骨骼
2351
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
