不容错过的 Window 8 Metro 风格 UI 资源
程序员文章站
2022-06-10 08:56:19
...
微软已经正式发布了windows 8操作系统,Windows操作系统的风格已经完全改变成了瓷贴状的Metro UI。
对于微软来说这是一个巨大的改变,而且所有微软的平台,包括桌面、平板、移动及网站都使用这个UI风格。
Metro UI包含了所有的现代web设计的特点:简化、基于网格的界面、富有连续性。大家如果有兴趣可以看看微软发布的《Windows Store应用程序用户体验指南》。
本文收集了很多Windows 8的Metro UI风格布局资源,希望大家喜欢!
一、Metro风格的网站框架和模板
1. Metro UI CSS
Metro UI CSS是一个非常完整的、用于创建Metro风格网站的框架。使用LESS创建,并且拥有网格系统、排版样式、表格、按钮和图片。同时也拥有内建的JavaScript组件,帮助你生成瓷贴、菜单、边栏、进度条、提示等等。
2. BootMetro
BootMetro是一个Twitter Bootstrap的Metro风格主题。你可以创建Metro风格的样式。例如,瓷贴UI、工具栏和其它组件。
3. metro-bootstrap
类似上面的BootMetro,这是另外一个Twitter Bootstrap主题,拥有所有的漂亮组件,并且包含了LESS。
4. Metro UI Template
这是一个网站的框架和模板,用来创建Windows 8 Metro UI风格的界面。拥有平滑的过渡效果和Tiles(包括RSS、Twitter、weather等)。
5. Droptiles – Metro-Style Web Dashboard
一个开源的Windows 8开始界面仪表板(类似iGoogle)。使用tiles来展示信息,每一个tiles是独立的应用,可以用来获取数据。这个项目基于ASP.NET,可以移植到其它语言。
6. PHP Image Gallery In Metro UI
一个PHP的图片画廊,可以自动生成缩略图,并且可以使用lightbox来显示图片。支持HTML5和CSS3。
7. Motown
一个用来创建Metro风格应用的类库,使用很少代码即可实现。不依赖其它JavaScript类库。
二、Metro风格jQuery插件资源
1. jq-metro
一个jQuery插件,用来创建Metro风格的界面。目前包含Panorama、Privot、进度条、列表选择、切换、按钮等。
2. Metro JS
这个jQuery Metro UI插件可以用来创建tiles、应用条,并且支持主题。功能和设计完全可定制。
3. jQuery Metro UI Plugin
这个插件可以简单的创建tiles视图并且支持聚焦。
4. jQuery Mobile Metro Theme
一个免费jQuery移动Metro UI主题,完全支持自定义。使用不同插件来处理应用栏、进度条、按钮和日期选择器。
5. Metro UI Theme Builder For jQuery UI
拥有themeroller风格的jQuery UI主题插件,帮助你创建Metro UI风格样式。
6. TileJS (non-jQuery)
使用标准的JavaScript代码来创建tiles,并且拥有完整tiles的onclick效果。
三、免费Metro UI图标
1. Modern UI Icons
一套简单手绘的Metro UI风格图标,拥有48x48大小的PNG格式及XAML文件。
2. Metro UI Dock Icon Set
一套670枚的Windows 8图标,而且还在添加中。拥有512x512 png格式、256x256 ico和svg格式。
3. Metro Icons
Windows Phone 7的图标,非常适合Metro UI应用。
来源:不容错过的window8 metro UI风格的web资源
对于微软来说这是一个巨大的改变,而且所有微软的平台,包括桌面、平板、移动及网站都使用这个UI风格。
Metro UI包含了所有的现代web设计的特点:简化、基于网格的界面、富有连续性。大家如果有兴趣可以看看微软发布的《Windows Store应用程序用户体验指南》。
本文收集了很多Windows 8的Metro UI风格布局资源,希望大家喜欢!
一、Metro风格的网站框架和模板
1. Metro UI CSS
Metro UI CSS是一个非常完整的、用于创建Metro风格网站的框架。使用LESS创建,并且拥有网格系统、排版样式、表格、按钮和图片。同时也拥有内建的JavaScript组件,帮助你生成瓷贴、菜单、边栏、进度条、提示等等。
2. BootMetro
BootMetro是一个Twitter Bootstrap的Metro风格主题。你可以创建Metro风格的样式。例如,瓷贴UI、工具栏和其它组件。
3. metro-bootstrap
类似上面的BootMetro,这是另外一个Twitter Bootstrap主题,拥有所有的漂亮组件,并且包含了LESS。
4. Metro UI Template
这是一个网站的框架和模板,用来创建Windows 8 Metro UI风格的界面。拥有平滑的过渡效果和Tiles(包括RSS、Twitter、weather等)。
5. Droptiles – Metro-Style Web Dashboard
一个开源的Windows 8开始界面仪表板(类似iGoogle)。使用tiles来展示信息,每一个tiles是独立的应用,可以用来获取数据。这个项目基于ASP.NET,可以移植到其它语言。
6. PHP Image Gallery In Metro UI
一个PHP的图片画廊,可以自动生成缩略图,并且可以使用lightbox来显示图片。支持HTML5和CSS3。
7. Motown
一个用来创建Metro风格应用的类库,使用很少代码即可实现。不依赖其它JavaScript类库。
二、Metro风格jQuery插件资源
1. jq-metro
一个jQuery插件,用来创建Metro风格的界面。目前包含Panorama、Privot、进度条、列表选择、切换、按钮等。
2. Metro JS
这个jQuery Metro UI插件可以用来创建tiles、应用条,并且支持主题。功能和设计完全可定制。
3. jQuery Metro UI Plugin
这个插件可以简单的创建tiles视图并且支持聚焦。
4. jQuery Mobile Metro Theme
一个免费jQuery移动Metro UI主题,完全支持自定义。使用不同插件来处理应用栏、进度条、按钮和日期选择器。
5. Metro UI Theme Builder For jQuery UI
拥有themeroller风格的jQuery UI主题插件,帮助你创建Metro UI风格样式。
6. TileJS (non-jQuery)
使用标准的JavaScript代码来创建tiles,并且拥有完整tiles的onclick效果。
三、免费Metro UI图标
1. Modern UI Icons
一套简单手绘的Metro UI风格图标,拥有48x48大小的PNG格式及XAML文件。
2. Metro UI Dock Icon Set
一套670枚的Windows 8图标,而且还在添加中。拥有512x512 png格式、256x256 ico和svg格式。
3. Metro Icons
Windows Phone 7的图标,非常适合Metro UI应用。
来源:不容错过的window8 metro UI风格的web资源