<p>vue3 と PrimeVue ライブラリを使用しています。 <code>:deep()</code> セレクターを使用して PrimeView コンポーネントの CSS フィールドをオーバーライドしようとしても、効果がありません。スコープ外のスタイルを使用する場合にのみ、変更が適用されます。なぜ機能しないのか混乱しています。 </p> <p><code>:deep()</code> を使用したサンプル コード: </p> <pre class="brush:js;toolbar:false;"><テンプレート> <トースト位置='右下'/> </テンプレート> <スタイルスコープ> :deep(.p-トーストメッセージアイコン) { マージン右: 10px !重要; } </スタイル> </pre> <p>これは機能しません。 </p> <p>ただし、スコープなしで <code>style</code> を使用する場合は、次のようになります。 </p> <pre class="brush:js;toolbar:false;"><style> .p-トーストメッセージ-アイコン { マージン右: 10px !重要; } </スタイル> </pre> <p>それはうまくいきます。 </p>