'title' 属性が CSS レンダリングと干渉するのはなぜですか?

提供された HTML ドキュメントでは、要素に a.css と b.css の両方を適用しようとしています。ページ上で。ただし、コード スニペットに示されているように、b.css のスタイルはレンダリングされません。

b.css にリンクする 要素に title 属性を設定することにより、スタイルシートは「優先」として分類されます。スタイルシート。」対照的に、title 属性のないスタイルシートは「永続的なスタイルシート」とみなされます。 HTML 仕様によると:

スタイルシート タイプ

• 永続スタイルシート: rel="stylesheet" でリンクされ、title 属性はありません。レンダリング中に常に適用されます。
• 優先スタイルシート: rel="stylesheet" および title 属性でリンクされます。タイトルごとにグループ化されますが、ブラウザはグループごとに 1 つの優先スタイルシートのみを表示します。
• 代替スタイルシート: rel="代替スタイルシート" とタイトルでリンクされます。タイトルごとにグループ化されており、ユーザーはブラウザが提供するインターフェイスからスタイルシートを選択できます。

この場合、title 属性を追加することにより、誤って b.css を優先スタイルシートとして分類することになります。グループごとに優先スタイルシートは 1 つだけである必要があるため、ブラウザーはレンダリングするスタイルシートの 1 つを選択し、結果として b.css.

が除外されます。そのため、a.css と b.css の両方が確実にが適用されている場合は、b.css にリンクしている 要素から title 属性を削除する必要があります。これにより、永続的なスタイルシートとして分類され、レンダリング中に a.css と一緒に使用されるようになります。