0
点赞
收藏
分享

微信扫一扫

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1

穆风1818 2022-12-12 阅读 108

HTML5然还在草案阶段,不过 HTML5 这名词实在越来越热,互联网上很多产品都深度应用了HTML5,比如WebQQ,

​​HTML5​​​然还在​​草案阶段​​​,不过 ​​HTML5​​ 这名词实在越来越热,互联网上很多产品都深度应用了HTML5,比如WebQQ,文章了解下。

HTML5 除了新增的元素(卷标)之外,还包括许多 JavaScript API,如果没有 Intellisense 还真的不太方便,如果你已经升级到 Visual Studio 2010 SP1 的话,那已经有支持部分 HTML5 的语法,不过并不够完整,微软最近推出的 ​​Web Standards Update for Microsoft Visual Studio 2010 SP1​​ 扩展套件就是打算用来定期提供 Visual Studio 2010 SP1 最新版的 Web 标准更新,未来预计每三个月就会更新一次 W3C 提出的相关规格变更,也期望微软能够尽快建立市场上最好的HTML5工具,因为现在很清楚,微软将穿着HTML5的外衣,坚定地致力于网络技术。

HTML5感知包括以下几个特性支持:

  • ​​WAI-ARIA​​—— 一个无障碍标准
  • ​​Microdata​​——语义标记语言
  • 修复了​​video​​和​​audio​​标签
  • ​​新的输入类型如email、URL、date​​
  • ​​拖拽​​
  • ​​Schema.org​​

更新带来许多了CSS3功能,包括:多列、圆角边框、动画、过渡和转换。Scott Hanselman的博客上发布了支持功能的​​完整列表​​。关于JavaScript,更新了关于Geolocation(地址位置)、DOM存储,包括本地和绘画存储,还有其他web API的感知和验证。

要安装 ​​Web Standards Update for Microsoft Visual Studio 2010 SP1​​ 扩展套件可以通过​​扩展管理器​​进行下载,各位只要查找 Web Standards Update for Microsoft Visual Studio 2010 SP1 就能找到该套件:

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Web

点选下载后并不会自动安装,由于是 Visual Studio 2010 SP1 的更新,因此下载的会是一个 Web Standards Update.msi

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_HTML5_02

这个更新会影响到的地方就是 Visual Studio 2010 的文本编辑器,最主要有三个地方会有效果:

  •  编辑网页文件时提供最新的 HTML5 支持 ( *.htm, *.aspx, *.ascx, *.cshtml, *.master, … )

打开网页时,通过“HTML 源代码编辑”工具栏即可切换至 HTML5 版本,切换过去后就能启用最新的 HTML5 Intellisense,如下图示:

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Web_03

切换到 HTML5 之后,你就能开始在网页中享用 HTML5 的新元素,以及 HTML5 新增的新元素属性

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Web_04

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Visual_05

不只有 HTML5 的卷标元素而已,包括 W3C 定义的最新版 JavaScript API 规格也同时提供 Intellisense 支持,如下图就是 ​​Geolocation API Specification​​ 的 Intellisense 支持图示:

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Web_06

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_HTML5_07

除了基本的 HTML5 标签支持外,此扩展套件还支持 ​​WAI-ARIA 标准​​​,可以让你的网页能够更进一步提供无障碍网页的支持程度。像一些很新的 ​​HTML Microdata​​​ 规格,在这次的更新中也都有支持。​​HTML Microdata​​ 让网页可以新增一些简单的 Metadata,去更明确的定义赋予网页内容更清楚的意义(语意)。

  • 编辑Javascript文件时( *.js )

编辑 js 文件时一样可以使用各种 W3C 定义的各种API 支持:

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_HTML5_08

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Visual_09

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_HTML5_10

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Web_11

  • 编辑 CSS 样式文件时 ( *.css )

在编辑 CSS 样式时,也能让 Visual Studio 2010 让编辑 CSS 时支持 CSS 3.0 规范:

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_Web_12

如下图是 CSS 3.0 多字段 (Multi-columns) 支持的样式属性:

Html5 学习利器 Web Standards Update for Microsoft Visual Studio 2010 SP1_HTML5_13

很神奇的只有在各家浏览器才支持的语法 Visual Studio 2010 SP1 也全部通通加进来支持了。

​​Scott Hanselman 的文章​​​列出了这次 ​​Web Standards Update for Microsoft Visual Studio 2010 SP1​​ 所有支持 Intellisense 与验证的范围:

HTML 5 features

  • ​​Video & related tags​​
  • ​​Audio & related tag​​
  • ​​New input types like email, url, date etc​​
  • ​​Drag & Drop support​​
  • ​​Accessibility standard WAI-ARIA​​
  • ​​Microdata​​
  • ​​Schema.org & more SEO friendly goodness​​

Browser APIs

  • ​​Geo-Location​​​ - Location aware websites are a clear, growing trend and now you've got full intellisense and validation within Visual Studio. For a nice sample, view source on the ​​IE9 test drive demo​​.
  • ​​Local Storage​​​ – IE has been supporting ​​local storage from IE8​​​, so now Visual Studio will provide you with full-fidelity intellisense to create sites which can save state within the browser. For sample of this, do a view source on ​​HTML5 Demo Site​​

CSS3

  • ​​2D Transforms​​
  • ​​3D Transforms​​
  • ​​Animations​​
  • ​​Background & Borders​​
  • ​​Basic Box Model​​
  • ​​Basic UI​​
  • ​​Behavior​​
  • ​​Color​​
  • ​​Flexible Box Layout​​
  • ​​Fonts​​
  • ​​Generated Content for Paged Media​​
  • ​​Hyperlink Presentation​​
  • ​​Line​​
  • ​​Lists​​
  • ​​Marquee​​
  • ​​Media Queries​​
  • ​​Multi Column​​
  • ​​Namespaces​​
  • ​​Paged Media​​
  • ​​Presentations Levels​​
  • ​​Ruby​​
  • ​​Selectors​​
  • ​​Speech​​
  • ​​Syntax​​
  • ​​Template Layout​​
  • ​​Text​​
  • ​​Transitions​​

​​Alternate Rows in ASP.NET GridView, Tables using HTML5 / CSS3​​

​​HTML5 Web Socket in Essence​​

​​微软SkyDrive弃Silverlight用HTML5​​



举报

相关推荐

0 条评论