18、Windows Store 应用开发：布局调整与系统集成

Windows Store 应用开发：布局调整与系统集成

1. CSS 媒体查询与视图状态处理

1.1 灵活容器与字体大小调整

在 Windows 8 应用开发中，灵活容器是核心的 CSS 技术，像 GridView、ListView 和 SemanticZoom 等组件都基于此。若要增大所有子元素的字体大小，可打开default.css文件，在flexible-container类中进行如下修改：

.flexible-container { font-size: 3em; // former value was 2em ... }

不过，当应用处于“快照”模式时可能会出现问题，字体变大可能会使内容溢出，需要使用滚动条来显示多余内容。

1.2 CSS 媒体查询的作用

CSS 媒体查询可根据运行时条件指示浏览器选择特定的 CSS 文件。每次创建新项目时，default.css文件中会包含以下预定义的媒体查询代码，用于 Windows Store 应用的四种视图状态：

@media screen and (-ms-view-state: fullscreen-landscape) { } @media screen and (-ms-view-state: filled) { } @media screen and (-ms-view-state: