IntelliJ IDEA 2019.2ヘルプ

コードスタイルHTML

WindowsとLinux用のファイル | 設定 | エディター | コード・スタイル | HTML
macOS用 IntelliJ IDEA | 環境設定 | エディター | コード・スタイル | HTML
Ctrl+Alt+S the Settings/Preferences icon


このセクションを使用して、HTMLファイルのフォーマットオプションを構成します。これらの設定を変更すると、変更の結果がプレビューペインに表示されます。

タブとインデント

タブ文字を使用

  • チェックボックスが選択されている場合、タブ文字はインデントとコードの再フォーマットに使用されます。

  • チェックボックスがオフの場合、IntelliJ IDEAはタブではなくスペースを使用します。

スマート・タブ

インデントは2つの部分で構成されます。1つの部分はコードブロックのネストに起因し、他の部分はアライメントによって決定されます。

  • このチェックボックスが選択されている場合、ネストの結果生じる部分にはタブとスペースの両方が(必要に応じて)含まれますが、alignmentによって定義される部分はスペースのみで構成されます。

  • このチェックボックスをオフにすると、タブのみが使用されます。これは、指定されたタブサイズに合うスペースのグループを再フォーマットした後、自動的にタブに置き換えられることを意味します。

タブ・サイズ

このフィールドで、タブに収まるスペースの数を指定します。

インデント

このフィールドでは、各インデントレベルに挿入されるスペース(またはタブ文字を使用チェックボックスが選択されている場合はタブ)の数を指定します。

連続インデントの文字数

このフィールドでは、式、メソッド宣言、およびメソッド呼び出しで、配列の要素間に挿入するスペース(またはタブ文字を使用チェックボックスが選択されている場合はタブ)の数を指定します。

空行でインデントを保持する

このチェックボックスをオンにすると、IntelliJ IDEAは空行にインデントを保持しているように見えます。チェックボックスをオフにすると、IntelliJ IDEAは空白行のタブ文字とスペースを削除します。

その他

項目

説明

右マージン

これらの設定を使用して、エレメントの右側に必要な余白スペースを指定します。デフォルトオプションを選択すると、グローバル設定から右マージンの値が使用されます。

入力時に折り返す

これらの設定を使用して、編集したテキストが指定した右余白にどのように適合するかを指定します。次のいずれかのオプションを選択できます。
  • デフォルト - この場合、IntelliJ IDEAはグローバル設定で指定された入力時に折り返すオプションを使用します。

  • はい - この場合、指定された右マージンの値が使用されます。

  • いいえ - この場合、このオプションはオフになり、行は右マージンで指定された数を超える可能性があります。

行ブレイクを維持する

このチェックボックスを選択すると、エディターでHTMLファイルを確認するときにIntelliJ IDEAが改行を受けるようになります。

テキスト内の改行を保持する

このチェックボックスを選択すると、エディターでHTMLファイルを確認するときにIntelliJ IDEAが属性に改行(たとえば、長い説明など)を付けるようにします。

空白行の維持

このテキストボックスには、再フォーマット後に保持する連続空白行の最小数を指定します。

属性の折り返し

このドロップダウンリストを使用して、属性行をどのようにラップするかを決定します。使用可能なオプションは次のとおりです。
  • 折り返しなし - このオプションを選択すると、特別な折り返しスタイルはコードに適用されません。

  • 長い場合は折り返す - このオプションを選択すると、右マージンを超える行が適切なインデントで折り返されます。

  • 長い場合に切り捨てる - このオプションを選択すると、リスト内の右マージンを超えた要素が折り返されて、1行に1要素ずつ適切なインデントが付けられます。

  • 常に折り返す - このオプションを選択すると、リスト内のすべての要素が折り返されて、1行に1要素ずつ適切なインデントが付けられます。

テキストの折り返し

このチェックボックスを選択すると、コードスタイル設定に従って長い行が折り返されます。

属性の位置合わせをする

このチェックボックスをオンにすると、属性を順次行に整列させることができます。

テキストの位置合わせをする

このチェックボックスを選択すると、IntelliJ IDEAはタグ内の複数の行を占めるテキストを整列させます。

空白を維持する

実際のホワイトスペースをタブで置き換えないようにするには、このチェックボックスを選択します。

スペース

この領域では、属性とタグ名のスペースの使用を定義します。
  • 属性の "=" の周囲 - このチェックボックスを選択すると、属性の "="記号の周囲にスペースが追加されます。

  • タグ名の周囲 - このチェックボックスを選択すると、タグ名の後にスペースが追加されます。

  • 空のタグ内 - 空のタグに空白を追加するには、このチェックボックスを選択します。

次のタグの直前に新規行を挿入する

この表示フィールドには、その前に新しい行を挿入するタグのリストが表示されます。フィールドの横にあるボタン icons general expandComponent svg を使用するか、または Shift+Enter を押してタグの前に新規行を挿入するダイアログボックスを開き、タグのリストを編集します。

次のタグの直前の新規行は除去する

この表示フィールドには、その前に改行を削除するタグのリストが表示されます。フィールドの横にあるボタン icons general expandComponent svg を使用するか、または Shift+Enter を押してタグの前の行ブレイクを除去するダイアログボックスを開き、タグのリストを編集します。

次のタグの子はインデントしない

この表示フィールドには、子をインデントしてはいけないタグのリストが表示されます。フィールドの横にあるボタン icons general expandComponent svg を使用するか、または Shift+Enter を押して次のタグの子はインデントしないダイアログボックスを開き、タグのリストを編集します。

またはタグが次のサイズ以上の場合:

このテキストボックスには、タグがインデントされていない行のタグの最小長を指定します。

インライン要素

この表示フィールドには、他のタグと同じ行のソースコードで表示されるタグのリストが表示されます。タグがリストから削除された場合、ソースコードにそのようなタグを追加すると、自動的に新しい行に移動されます。フィールドの横にあるボタン icons general expandComponent svg を使用するか、または Shift+Enter を押してインライン要素ダイアログボックスを開き、タグのリストを編集します。

内側に空白を維持する

この表示欄は、あるとして、エディターは変更せず、空白を維持したいの内側にタグのリストが表示されます。フィールドの横にあるボタン icons general expandComponent svg を使用するか、または Shift+Enter を押して内側に空白を維持するダイアログボックスを開き、タグのリストを編集します。

インライン・コンテンツの場合は中断しない

この表示フィールドには、コンテンツがインライン展開されている場合にラップされないタグのリストが表示されます。フィールドの横にあるボタン icons general expandComponent svg を使用するか、または Shift+Enter を押してインラインコンテンツのみをラップしないでくださいダイアログボックスを開き、タグのリストを編集します。

生成される引用符

=の入力時に、HTML属性の周囲に自動的に挿入される引用符(ダブル、シングル、またはなし)のスタイルを選択します。

これは、JavaScriptやPHPを使用してHTMLを動的に挿入し、JavaScriptやPHP文字列に二重引用符を一貫して使用し、コピーや貼り付けなどの問題を防ぐために一重引用符でHTMLを使用する場合に重要です。

フォーマットを強制する

このチェックボックスが選択されていると、コードの再フォーマット時に、以前に生成された引用符が置き換えられます(たとえば、二重引用符と一重引用符)。

配置

このタブでは、好みに応じてHTMLコードを並べ替えるための一連の規則を定義します。

一致ルール

この領域を使用して、ルールのリストとして要素の順序を定義します。すべてのルールには、修飾子や型などの一致のセットがあります。
  • icons general add svg - このボタンを使用してルールを追加します。空のルール領域が開きます。

  • icons general remove svg - このボタンを使用してリストからルールを削除します。

  • icons actions edit svg - このボタンを使用して既存のルールを編集します。このボタンを表示するには、編集するルールに移動してボタンをクリックします。表示されるポップアップで、ルールフィールドを変更します。

  • icons actions previousOccurence svg icons actions nextOccurence svg - これらのボタンを使用して、選択したルールを上下に移動します。

空のルール

このエリアを使用して、新しい一致ルールを作成するか、既存のルールを編集します。次のフィルタから選択できます。
  • - このフィルタを使用して、ルールのタグまたは属性を選択してください。
    typeキーワードを2回クリックすると、条件が無効になることに注意してください。

  • 名前 - このフィールドを使用して、ルールのエントリ名を指定します。このフィルターは、タグ名や属性名などのエントリー名のみに一致します。フィルターは正規表現をサポートし、標準の構文を使用します。一致は、名前全体に対して実行されます。

  • 名前空間 - このフィールドを使用して、ルール内のネームスペースを指定します。名前空間の属性位置を制御する規則を指定できます。

  • 順序 - このドロップダウンリストを使用して、ルールの並べ替え順序を選択します。このオプションは、複数の要素が同じ一致規則を使用している場合に便利です。この場合、秩序を保ちますを選択しても並べ替え前の設定と同じ順序が保持され、名前順を選択すると同じ一致規則を持つ要素が名前順に並べ替えられます。

icon sort

このアイコンは、順序リストから名前順を選択すると表示されます。アイコンは、このルールの項目がアルファベット順にソートされていることを示します。

次からセット

該当する場合、リンクはページの右上隅に表示されます。このリンクをクリックして、現在の言語コードスタイルのベースとして使用する言語を選択します。

コードスタイル設定の初期セットに戻り、変更を破棄するには、リセットをクリックします。

最終更新日: 2019年8月19日

関連事項

関連ページ:

コード・スタイル

WindowsとLinux用のmacOS用スキーム:この領域では、コードスタイルスキームを選択し、必要に応じて変更します。コードスタイルスキームの設定は、IntelliJ IDEAがコードを生成、リファクタリング、または再フォーマットするたびに自動的に適用されます。コードスタイルはプロジェクトレベル...

再フォーマットとコードの並べ替え

IntelliJ IDEAでは、コード・スタイル設定で指定した要件に従ってコードを再フォーマットできます。設定にアクセスするには、設定/環境設定ダイアログ でに進みます。コードの一部、ファイル全体、ファイルのグループ、ディレクトリー、およびモジュールを再フォーマットできます。コードの一部または一部の...

コードスタイル: ERB

WindowsとLinux用のmacOS用このセクションを使用して、ERBファイルのフォーマットオプションを構成します。これらの設定を変更すると、変更の結果がプレビューペインに表示されます。タブとインデント:タブ文字を使用このチェックボックスをオンにすると、タブ文字が使用されます。キーを押すと、イン...

コードスタイル: JavaScript

WindowsとLinux用のmacOS用このセクションを使用して、JavaScriptファイルのフォーマットオプションを構成します。これらの設定を変更すると、変更の結果がプレビューペインに表示されます。タブとインデント:タブ文字を使用チェックボックスが選択されている場合、タブ文字はインデントとコー...

スタイル・シート

IntelliJ IDEAを使用すると、Sass、Less、SCSS、Stylusなど、CSSおよびそれにコンパイルされるさまざまな言語でスタイル定義を記述できます。スタイルシートのドキュメントを参照したり、ルールセットを作成および移動したり、変数を抽出したりすることもできます。コード補完:Inte...