Web開発者がVS2008ですぐに発見するだろう大きな機能の1つは劇的にHTMLデザイナが改善された部分と、それがもたらすそのリッチなCSSサポートです。

VS 2008は現在マイクロソフトの新しいExpression Web製品で出荷されるWebデザイナと同じものを使用しています。新しい機能をたくさん提供していることもそうですが、このWebデザイナがVS2005バージョン（かなり古いコードベースに基づいている）に比べて非常に高速になっていることに気づかれると思います。

VS2008および無料で提供されるVisual Web Developer 2008 Expressのどちらでも活用することのできる新しいWebデザイナの機能をいくつか以下で簡単にご紹介します。

ビューの編集を分割（スプリットビューの編集）

ソースビューとデザインビューのサポートに加えて、VS2008ではページ上で作業する際に新しく"分割（スプリット）ビュー"モードのサポートを追加しました。これでHTMLソースとデザインビューが同時に見ることができるようになり、簡単に1つのビューで加えた変更がもう１つのビューで更新された事を確認できるようになります。

CSS スタイルマネージャ

VS2008ではIDEの中で"Manage Styles（スタイルの管理）”と呼ばれる新しいツールウィンドウをサポートしています。現在編集中のページのCSSスタイルシートとそれに対応したルールが全て表示されます。デザインビューの時もソースビューの時も使用することができます。

スタイル管理ウィンドウで丸く囲まれたCSSルールは現在のドキュメント内で使用されている特定のルールを示しています。マウスをルール上にマウスオーバーすると簡単にCSSルールの値を確認することができます。

CSSルール上で右クリックするか"スタイルの修正"を選択するとグラフィックなCSSルールエディタが表示されます。またはスタイル管理ウィンドウでルールをダブルクリックすると自動的にスタイルシートのファイルが開かれて、すぐにCSSソース定義の編集（全てのインテリセンス付きで）に取り掛かることができます。

"スタイルの管理"ツールウィンドウを最大活用するためのチップやヒントなどの詳細については、このブログ投稿を読んでください。.

CSSプロパティウィンドウ

デザイン、ソースビューの両方でサポートされている別の新しいCSS機能の1つは新しいCSSプロパティウィンドウです。

HTML要素またはASP.NETサーバコントロールを選択すると、CSSプロパティウィンドウが現在適用されているCSSの設定を全て表示します。CSSプロパティグリッドを使用して全ての値を変更することができます。スタイルツールバーにある"目的のルール（ターゲットルール）"により、どのルールでその設定が適用されるようにするかを決定することができます。（スタイルのツールバーまたはターゲットルールドロップダウンについての詳細は、このブログの投稿を読んでください。）

もし、私のように、時々大きいCSSスタイルシートと奮闘して、内心"なんで$！#@はこんななんだ？"と叫んでいるとしたら、CSSプロパティウィンドウの"サマリ（まとめ）"ビューが非常に便利（CSSプロパティペインの一番上にあるサマリボタンをクリックするだけ）だと思うと思います。このボタンを押した時、フィルタリングモードが有効になり、現在作業しているHTML要素またはASP.NETコントロールに対するCSSルールの全ての継承が表示されます。

上記のプロパティグリッドで、いくつかの値が複数回複製されている（前回の値が取り消された赤の矢印付きで）ことに気づかれると思います。これは親CSSルールの設定が他のCSSルールの値でオーバーライドされていることを示しています。サマリビューの下で元の値とオーバーライドされた値の両方を見ることができます。

各値をクリックしてこの値がCSSの祖先階層のどこから継承されたのかまたオーバーライドされたのかを確認することができます。以下の例ではカーソルのある現在の要素に対する最終的な色が濃茶色（ダークブラウン）であることが分かります。この最終カラー値を選択した場合、CSSプロパティウィンドウは上部の適用ルールリストに青い四角を描画し、この設定が"singlecontent h3"ルールに設定されたことを示します。

もしこのオーバーライドされたルールの（赤の取り消し線が付いた）薄茶色の設定上をクリックした場合、それがページのHTMLのbodyのCSSルールに紐づいていたことが分かると思います。（以下でオーバーライドされた値を選択した時適用ルールリストでbodyルールがどのように選択されるかを確認してください。）

CSSのプロパティウィンドウの使い方の詳細については、CSSプロパティウィンドウのブログ投稿を読んでください。

CSSソースビューのインテリセンス

HTMLデザイナはデザインビューで要素やコントロールを選択する機能をサポートしており、CSSリストからルールをグラフィカルに選択してそれに適用することができます。

またソースモードの時に今ではCSSクラスルールを特定するためにインテリセンスのサポートがあることにも気づかれるかと思います。

これはHTML要素（上記のように）およびASP.NETサーバコントロールの両方に当てはまります。

このCSSインテリセンスは標準のHTML・ASP.NETページ（またマスターページやネストされたマスターページに基づいたページで作業する時も）の両方でサポートされています。

ネストされたマスターページのサポート

今月の初旬に新しいVS 2008 ネストされたマスターページのサポートだけに従事したブログを投稿しました。当然上記のデザイナおよびCSS機能は全てそれとも機能します。

まとめ

上記の投稿ではVS2008での新しいHTMLデザイナとCSSツールのサポートをいくつか簡単にご紹介しました。（上記の機能は全て無料のVisual Web Developer 2008 Expressエディションにもあります。）

VS2008は今やマルチターゲットサポートしているため、これらの機能を.NET3.5をサーバにインストールしなくてもすぐに使用することができます。VS2008で既存のASP.NET2.0プロジェクトを開いて、ランタイムのターゲットとして.NET2.0を継続してターゲットとするようにして、すぐにこれらの機能を使い始めることができます。

次週にかけて、新しいマルチパートブログシリーズを開始して、.NET3.5のASP.NETの一部として出荷される新しい<asp:listview>コントロールについてカバーしたいと思っています。<asp:listview>の大きな利点の1つは、データシナリオで出力されるHTMLに対して開発者が全て管理することができることです。これは上記の新しいCSSツール機能と上手く機能し、もっと簡単に見た目の優れたWebサイトやアプリケーションを作ることができるようになります。

Hope this helps,

Scott