Как може да се използва външен стилов лист за стилизиране на елементи на Polymer 1.0?

Елементите на Polymer 1.0 съдържат персонализирани CSS променливи, които ви позволяват да ги стилизирате, като използвате вградени стилове като такива:

<style is="custom-style">
  paper-toolbar {
    --paper-toolbar-color: blue;
  }
</style>

Това работи и е фантастично. Как мога да постигна същото, но използвайки външен лист със стилове? Добавянето на is="custom-style" към етикета за връзка изглежда няма ефект, тъй като следното не работи:

<link rel="stylesheet" media="all" href="/bgapp.css" is="custom-style">

css polymer polymer-1.0
person David Smith    schedule 26.06.2015    source източник

Отговори (1)


arrow_upward
12
arrow_downward

Можете да заредите HTML файла, съдържащ вашия custom-style, както бихте направили с полимерен елемент:

<link rel="import" href="/bgmy-custom-style.html">

И вашият my-custom-style.html файл ще съдържа:

<style is="custom-style">
    paper-toolbar {
        --paper-toolbar-color: blue;
    }
</style>

От Polymer 1.1 тази функция вече е отхвърлена. Вижте тук за актуализиран отговор

person Ben Thomas    schedule 26.06.2015
comment
Това е моделът, който екипът на Polymer използва за своите хартиени елементи: github.com/polymerelements/paper-styles - person Zikes; 26.06.2015
comment
Но какво правите, ако използвате meteorjs например, където той взема всеки css файл и ги свързва автоматично в един? Нямате влияние върху начина, по който стиловият таг е написан в meteor, нито можете да импортирате персонализиран html файл с css (е, бихте могли, но това означава, че генерирате повече http заявки ofc) - person Andreas Galster; 16.07.2015
comment
Моля, имайте предвид, че този метод вече е отхвърлен в Polymer 1.1 (polymer -project.org/1.0/docs/devguide/). Погледнете отговора ми (stackoverflow.com/questions/32298500/) на този въпрос. - person Justin XL; 31.08.2015
comment
Благодаря, че посочи това JustinXL. Ще сложа връзката в отговора си. - person Ben Thomas; 17.11.2015