如何用css做到像windows的aero一样效果

html-css021

如何用css做到像windows的aero一样效果,第1张

这个css是无法实现局部模糊的,所以做不到,但是有一点可以做到就透明

.xx{background:rgba(255,255,255,0.4)}这样就是一个背景色为白色 透明度为50%的效果了但是IE9一下不支持这种写法,模糊也是:

.blur {

filter: url(blur.svg#blur)/* FireFox, Chrome, Opera */

-webkit-filter: blur(10px)/* Chrome, Opera */

-moz-filter: blur(10px)

-ms-filter: blur(10px)

filter: blur(10px)

filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false)/* IE6~IE9 */

}

那个效果一个是窗口区域背景模糊,一个是窗口区域窗口半透明。 背景模糊可以做,但是背景局部模糊办不到

ero\x0d\x0a\x0d\x0aWindows Aero从Windows Vista开始使用的重新设计用户界面,透明玻璃感让使用者一眼贯穿。"Aero"这个字是首字母缩略字,即是Authentic(真实)、Energetic(动感)、Reflective(具反射性)及Open(开阔)的缩略字,意为 Aero 界面是具立体感、令人震撼、具透视感和阔大的用户界面。 Windows Aero 可用于使用兼容图形适配器并运行 家庭高级版、商用版、旗舰版或 企业版的 Windows Vista 的 PC,它给您的 PC 带来全新的外观。 Windows Aero 提供高质量的用户体验,大大方便您看到并处理信息,并提供更加流畅,更加稳定的桌面体验。\x0d\x0a\x0d\x0aWindows Aero 的两项激动人心的新功能 Windows Flip 和 Windows Flip 3D,使您能够自信地在您的桌面上以视觉鲜明的便利方式管理窗口。 除了新的图形和视觉改进,Windows Aero 的桌面性能同外观一样流畅和专业,为您带来简单和高品质的体验。\x0d\x0a\x0d\x0aGlass\x0d\x0a您会立刻发现在“开始”菜单和窗口边框上新的半透明效果,这是一种看起来很专业的“玻璃”设计,通过诸如动态反射和平滑动画等细微的效果使其得到增强。 新“玻璃”窗口的设计舒适简单,传达一种轻量开放的感觉,使您专注于内容而非环境。半透明清晰。\x0d\x0a您可以更改颜色、饱和度、甚至透明等级,以获取您想要的确切的外观。使您的窗口个性化。\x0d\x0a\x0d\x0a动态窗口\x0d\x0a当您将窗口减到最小时,它以动画的形式平滑地移动到任务栏上,这样当您需要它时,会更容易找到。\x0d\x0a\x0d\x0a高点/英寸 (dpi) 支持\x0d\x0aWindows Aero 支持高分辨率显示器,这样您就可以得到体积更小但视觉更丰富的膝上型或平面显示器,显示高分辨率的易读图像。 Windows Vista 甚至可以将其界面和某些程序放大到令人震撼的 144 dpi,给依靠高需求图形密集程序的人带来了巨大的好处。活动任务栏图标使您的工作得以简化。\x0d\x0a\x0d\x0a活动任务栏缩略图\x0d\x0a在 Windows Aero 中,活动任务栏缩略图既显示当前打开窗口的实际内容,也显示任务栏中最小化窗口内的内容。 当您将鼠标指针停在任务栏上平铺的标题时,您不用将其带到前台即可看到该窗口的“活动”内容。Alt+Tab 显示每个窗口的微小视图。\x0d\x0a\x0d\x0aWindows Flip (Alt+Tab)\x0d\x0aWindows Flip 是之前的 Windows 版本中的 Alt+Tab 功能的升级。 Windows Flip 可以显示打开窗口的活动缩略图,而不是通用图标,这使您可以更加轻松地确定要查找的窗口。 其中一个显示的窗口始终是您的桌面本身,为您提供了一种快捷简便的方法,以便最小化您桌面上所有打开的窗口。轻松在打开的窗口间进行三维翻页。\x0d\x0a\x0d\x0aWindows Flip 3D\x0d\x0aWindows Flip 3D 为您提供了查找您想要的窗口的新方法。 当您按 Start+Tab 组合键时,Windows Flip 3D 会动态显示您桌面上所有打开的三维堆叠视图的窗口。 在该视图中,您可以在您打开的窗口中旋转,找到您正在查找的窗口。 Windows Flip 3D 甚至可以显示活动的进程,如播放视频。 您也可以使用箭头键或鼠标上的滚轮在打开的窗口间顺畅地翻转,并选择您所需的窗口。\x0d\x0a\x0d\x0a更流畅执行的桌面\x0d\x0a在使用 Windows Aero 时,当您移动或重新设置打开窗口的大小时,窗口可以在屏幕上滑动。 您将不会看到有时在现有界面上出现的刷新效果、滞后或“图像撕裂”情况。 在 Windows Aero 中,您将遇到更少与图形驱动器相关的系统故障和停止错误。\x0d\x0a\x0d\x0a语调\x0d\x0aVista User Experience Guidelines 也解决了在 Aero 用户界面中用文本书写的“语调”(Phrasing tone)问题。微软公司以前的设计指导中很少涉及用户界面的文本应该如何拼写,因此在以前的系统带来了在操作系统不同部分之间的信息与要求表示方法不一致的情况(例如在不同属附软件中,一个相同的物件会有几种不同称呼,对使用者产生混淆)。\x0d\x0a微软公司的研究表明 Windows 对于用户来说难于使用。用户对于有些消息的表述不甚满意或者感到厌烦。尤其是一些计算机术语及行话的过度、不一致的应用,对于新用户来说更是一道门槛,并且有些消息不甚明了甚至是盛气凌人。例如在以往的 Windows 版本内,每逢系统遇上问题便会提示使用者联络系统管理员或网络管理员,如使用者一种“推卸责任”的方法,传使用者在解决问题时根本得不到微软提供的资讯,往往只能从自己经验去解决,所以对新用户造成极大困扰。\x0d\x0aVista 及其应用程序指导建议这些消息用简洁、客观、确定地正确表达技术问题建议,并且假定聪明的用户能够据此解决特定的问题。比如一些特定的建议包括使用第二人称以及主动语态(如“打印照相机中的照片”),要避免使用“请”或者“对不起”这样的词汇;这个行为和 Microsoft 的主要竞争对手 MAC 的“User Friendly”完全相反。\x0d\x0a系统需求\x0d\x0a\x0d\x0a微软发表了支援Windows Aero的电脑配置,名为Vista Premium Ready。能达到或超越Premium Ready要求的电脑才能使用到新的Aero技术。\x0d\x0a1GHz的32位元(x86)、64位元(x64)中央处理器(CPU)\x0d\x0a1GB的内存。\x0d\x0a可执行Windows Aero的图形处理器\x0d\x0a128MB的图形内存\x0d\x0a40GB的硬盘,15GB的可用空间\x0d\x0aDVD-ROM\x0d\x0a音讯输出功能\x0d\x0a因特网连线功能\x0d\x0a而显卡的最低需求则需要是Intel的GMA 950(945G芯片组)、ATI Technologies Radeon 9500系列或NVIDIA GeForce FX 5200系列的显卡等。\x0d\x0a与Mac OS X界面的相近之处\x0d\x0a\x0d\x0aWinSuperSite评论者Paul Thurrott指出了很多Aero界面与Mac Aqua界面的相近之处;他提出 Aero界面的半透明技术将“难以避免”人们把Aero界面与Mac OS X界面比较。 资深Mac专栏作家和书本作家John Rizzo在eWeek的一篇文章写到:“微软似乎从Mac OS X的用户界面和功能中取得很多线索,例如是一些专门用语等,甚至乎一些Vista的图示竟然出奇地与Tiger的图示甚为相似。”