カスタムCSSおよびSharePoint Onlineの

Question

私は明確化を得ることは非常に困難であるがため、Microsoftの混乱とあいまいな記事に、ブランディングのためにオンラインSharePointで使用することができ、サポートおよびサポートされていないカスタマイズやカスタムCSSのアプローチのために研究していました。

私が発行サイトで別のCSSを通じてカスタムCSSを適用すると、この記事に探しに研究していた。そこにこの記事の一点で

https://msdn.microsoft.com/en-us/pnp_articles/portal-branding

「一般原則」の下で、この点は曖昧/曖昧です詳細な説明はしていません。

一般原則

のSharePoint Online環境でポータルをブランディングする場合は、次の一般原則が考慮されるべきである：

SharePoint Onlineのサービスが絶えず向上しています。サービスにプロビジョニング更新は（例えば、マスターページ）DOMボックスのページのうちの構造、及びボックスファイルのうちの内容に影響を与える可能性があります。開発者はこれを覚えておく必要がありますし、サポートされていないカスタマイズアプローチ（ページのDOM構造内の特定の要素の例えば、位置）に頼るべきではありません。

上記の点で、それは言及：開発者はこれを覚えておく必要がありますし、サポートされていないカスタマイズアプローチ（ページのDOM構造内の特定の要素の例えば、位置）に頼るべきではありません。 - これはどういう意味ですか？これは、カスタムCSSには適用されない唯一の内のWebパーツゾーンとOOTBのWebパーツにのみ適用され、いくつかのWebパーツページやCSS上の代替CSSのURLを介して適用。

誰かがこれを明確にすることはできますか？私は専門家の意見が必要です。上記のステートメントは、Office 365 bar DOMにのみ適用され、OOTB WebパーツページのCSSまたはDOMですか？もしそうなら、どのように？誰かが例を挙げてくれますか？私はカスタムCSSを書いて、代替CSS URLを使って適用しました。ほとんどの場合、WebパーツゾーンとOOTBリストビューのWebパーツ（色、幅、フォントなど）の外観が変更されます

Answer 1

これは関連しないSharePoint、特に外部のCSSスタイルシートを使用することさえあります。

が

「開発者は、[...]に頼るべきではありません[...]ページのDOM構造内の特定の要素の位置は」

それは次のとおりです。のは、第二の言語を打破してみましょうMicrosoftは要素IDやクラスではなく、DOM構造に基づいて要素をターゲットにするためにCSS（またはJavaScript）を使用することを指していると私は考えている。 （直ちに<p>要素を進む任意<div>要素をターゲット）p + divを考えます。この状況で

、それが動作します。この状況で

p + div { 
 
    color: red; 
 
}

<p>Text</p> 
 
<div id="div">More text</div>

を、そうでない：

p + div { 
 
    color: red; 
 
}

<p>Text</p> 
 
<a>Link</a> 
 
<div id="div">More text</div>

すべてのI DOM内の要素の位置を#divに移動しましたが、突然セレクタが機能しなくなりました。私はこれがマイクロソフトが暗示している危険だと考えています。このように

は、#select the IDにして、目的の要素直接をターゲットにはるかに '安全な' 次のようになります。

#div { 
 
    color: red; 
 
}

<p>Text</p> 
 
<a>Link</a> 
 
<div id="div">More text</div>

もちろんあるだろうな状況ます場所には要素のIDがではありませんが、class selectors,attribute selectors、またはさらにtype selectorsである。 specificityと作業し、可能な限り文脈を避けることを目指して、スーツに適応してください。

希望すると便利です。 :)