Как применить страницу css к полимерному компоненту

Я хочу, чтобы мой полимерный компонент использовал стили из «обычной» таблицы стилей. Поэтому я добавил регулировочной шайбы-shadowdom к стилю и/глубоко/к классу, как это:Как применить страницу css к полимерному компоненту

<html> 
    <head> 
    <style shim-shadowdom> 
     .mylink /deep/ {color: orange;} 
    <style> 
    </head> 
    <body> 
    <my-link></my-link> 
    </body> 
</html>

, а затем компонента:

<polymer-element name="my-link"> 
    <a class="mylink" href="#">xxx</a> 
</polymer-element>

Но это не работает ни в хроме - ссылка все еще имеет свой обычный цвет - нет в ff и т. д. - ссылки там оранжевые, но они оранжевые, даже без/глубокие/или shim-shadowdom.

Вопрос - что я здесь делаю неправильно?

Полимерная версия - 0.5.5.

PS: кроме моделирования, полимер работает как ожидается - все компоненты отображаются вверх, ajax отправляет свои запросы и так далее.

источник

2015-04-24 user656449

Вы будете нуждаться my-link /deep/ .mylink

Edit: Кроме того, окружить <a> с <template> элементом. Убедитесь, что ваш элемент импортирован!

источник

2015-04-25 01:40:44

спасибо! Вот и все! Я действительно неправильно понял/глубокий/синтаксис, поэтому полимер не имеет ничего общего с моей проблемой. Единственное, что стоит добавить, это то, что для применения стиля по страницам «body/deep/.style {...» может быть более удобным. – user656449

И еще одна вещь: стиль стилей был применен в IE и FF: «Потому что сложность полифорирования поведения стиля Shadow DOM затруднена, Полимер решил оптимизировать практичность и производительность. Например, полиполки не защищают элементы Shadow DOM против CSS уровня документа. " (https://www.polymer-project.org/0.5/docs/polymer/styling.html#handling-scoped-styles) – user656449

@ user656449 Нет проблем! Я здесь, чтобы помочь. Если вы нуждаетесь во мне, просто спросите: D –

Как применить страницу css к полимерному компоненту

ответ

Смежные вопросы