Css–sélecteur pour quand un document html est à l'intérieur d'une iframe?

Je suis en train de faire un css sélecteur qui attribue diffrent properites en fonction de la météo le code html est à l'intérieur d'une iframe ou pas. J'ai essayé ceci:

html:not(:root) body {
    background: black !important;
}

Je m'attends à ce que cela s'applique background: black; pour le corps, si elle est à l'intérieur d'une iframe, mais il ne le fait pas, pourquoi? Et il y a des css options? J'ai toujours pu vérifier avec javascript si le html est la racine.

IE8 soutien pas requierd.

Le corps est parfois affichée à l'intérieur d'une iframe comme un widget sur le site d'un tiers, et parfois, il est affiché sur son propre.
Vous ne pouvez pas appliquer le style CSS de l'extérieur de l'iframe. Un <iframe> est son propre monde. Si les domaines etc. match, Javascript peut communiquer dans et à l'extérieur, et peut (s'il le voulait) injecter CSS dans un cadre enfant. stackoverflow.com/questions/3286178/...
Répondu et puis vu votre concession que vous pouvez toujours utiliser le javascript, ce qui était exactement ce que je suggère. Ce que je comprends de la façon dont CSS fonctionne à l'intérieur des cadres, je n'ai pas c'est une option ici 🙁
Cela permettra de mettre la lumière sur votre sujet, veuillez l'examen de cette réponse
Kumar: Cette question est d'une nature très différente.

OriginalL'auteur Himmators | 2014-02-18

  1. 16

    CSS n'est portée, dans le même document. Une iframe est un document entier dans son propre droit, et donc une règle CSS qui s'applique à la page qui contient que les iframe ne peut pas s'appliquer à la page dans qui iframe.

    Cela signifie que, pour autant que le HTML et le CSS sont concernés, html est toujours :root (et peuvent donc jamais être :not(:root)).

    Sauf si vous êtes capable de transférer cette CSS de la page qui les contient à la page dans l'iframe (à l'aide d'un script par exemple), je ne crois pas qu'il existe un moyen en utilisant simplement CSS.

    C'est bizarre que javascript permet de vérifier si des _self=_top mais pas css...
    Ils fonctionnent très différemment. Comme je l'ai dit, le CSS est strictement par document.

    OriginalL'auteur BoltClock

  2. 11

    Il est probablement possible de faire le style dans un iframe avec JavaScript.

    document.querySelector('iframe').contentDocument.body.querySelector('#some-element').style.background-color = 'red';

    IMPORTANT: assurez-vous que l'iframe est sur le même domaine, sinon vous ne pouvez pas obtenir l'accès à son fonctionnement interne. Que serait cross-site scripting.

    De l'accès aux éléments à l'intérieur iframes avec JavaScript document de plus amples ici: Javascript - Get élément dans une iFrame

    OriginalL'auteur ThorSummoner

  3. -1
    html:not(root) body {
    background: black !important;
}

    Œuvres

    Cela ne fonctionne pas sur Chrome 39, et je ne pense pas que ça sur n'importe quel autre navigateur.

    OriginalL'auteur webmister