CSS のコーディング支援

構文のハイライト

ReSharper は、セレクター、プロパティ、プロパティの値、アットルール ( @import や @media など)、プロパティ値として使用できる関数、疑似クラスなどをハイライトします。CSS のデフォルトの構文ハイライト:

ReSharper でサポートされているすべてのファイルタイプに共通の標準構文ハイライトに加えて、CSS ファイルの特別な機能もいくつか用意されています。どの色の値にもそれぞれの色で下線が引かれていますが、色の定義方法（色名、16 進コード、RGB コード）は関係ありません。

カラー値の上にマウスを置くと、ツールヒントが表示されます。色が CSS (CSS および HTML) 仕様で定義されている色のいずれかの場合は、アイコンの近くに色の名前が表示されます。それ以外の場合は、16 進コードと RBG コードが対応するカラー値のツールチップに表示されます。

色の定義と色を選択しますダイアログの詳細については、カラーアシスタンスを参照してください。

コード補完

ReSharper は CSS ファイルと CSS が使用できる他のファイルタイプで独自の IntelliSense を提供します。HTML 5 で導入されたものも含め、HTML タグ名の完成に役立ちます。

実際、ReSharper コード補完は、セレクタを指定するときに複数のシナリオで役立ちます。例: コロンの後に利用可能な擬似クラスのリストを提供します。

確かに、ReSharper コード補完は利用可能なプロパティを提案しています ...

... とプロパティ値:

さらに、ReSharper は class 属性の値の中でコード補完を呼び出すときに使用可能なクラスを提案しています ...

... および HTML または ASP.NET マークアップファイルの id 属性内に使用可能な ID:

コンテキストアクションの例

ReSharper は、CSS コードを対象とする一連のコンテキストアクションを提供します。これらのアクションの完全なリストは、ReSharper オプションのコード編集 | CSS | コンテキストアクションページにあります。必要に応じて、このページを使用して一部のアクションを無効にすることもできます。

現在のキャレット位置でコンテキストアクションが使用可能になるとすぐに、ReSharper は対応するアクションインジケーター をキャレットの左側に表示します。しかし時々、ReSharper は現在のキャレットポジションのために文脈上利用可能ないくつかの機能を提供します。この場合、最も優先度の高いアクションに対応するアクションインジケータが表示され、その他のすべてのアクションは、アクションインジケータをクリックするか、Alt+Enter を押してアクションリストを展開したときにのみ表示されます。コンテキストアクションは最も優先順位が低いため、アクションリストの一番下に表示されることがよくあります。

CSS のコンテキストアクションの例を次に示します。

色を定義または変更するには、次のコンテキストアクションを適用します。色を選択しますダイアログが表示され、必要な色を選択できます。

クイックドキュメント

テキストエディターまたはファイル構造ウィンドウからクイックドキュメントを呼び出すことができます。

追加情報が必要な場合は、詳細を読むをクリックして仕様に直接移動します。

コードを再配置

CSS ファイルではコードの再配置機能がサポートされているため、CSS コードの要素と論理ブロックをすばやく再配置できます。