2016-03-25 21 views
6

Polymer có hỗ trợ cho <style is="custom-style"> cho phép bạn xác định kiểu chỉ áp dụng cho các thành phần, ví dụ: bóng DOM.kiểu tùy chỉnh và kiểu được chia sẻ trong polymer

Polymer cũng có hỗ trợ cho <dom-module id="shared-styles"> cho phép bạn gói một tập hợp các khai báo kiểu có thể được nhập vào định nghĩa phần tử.

Do đó, điểm của cả hai dường như là cho phép bạn tạo kiểu cho một phần tử polymer. Tại sao bạn sử dụng cái này qua cái kia? Các trường hợp sử dụng chồng chéo đáng kể, có vẻ như.

Sự nhầm lẫn bổ sung: shared-styles có thể được nhập vào custom-style. Tại sao bạn sẽ làm điều này? Tại sao không?

Trả lời

13

A <dom-module id="my-shared-styles"> tuyên bố mũ mô-đun kiểu có thể sử dụng lại mà bạn có thể nhập vào các thành phần hoặc <style is="custom-style"> thẻ.

Sử dụng trong một phần tử tùy chỉnh

<dom-module id="my-element> 
    <template> 
    <style include="my-shared-styles"></style> 
    ... 
    </template> 
</dom-module> 

hoặc trong <style> thẻ bên ngoài một yếu tố tùy chỉnh (ví dụ như trong <head>)

<head> 
    <style is="custom-style" include="my-shared-styles"></style> 
</head> 

<style is="custom-style"> chỉ được yêu cầu khi bạn muốn sử dụng tính năng Polymer CSS (Biến CSS và mixin) trong phần tử kiểu không nằm trong một số <dom-module>. Bên trong <dom-module> chỉ <style> là đủ.

+0

Có vấn đề nào chỉ có thể được giải quyết bằng một kỹ thuật không phải là kỹ thuật khác không? –

+0

Cả hai đều hỗ trợ các tính năng CSS của CSS. Sự khác biệt là phạm vi áp dụng các kiểu. Không thể áp dụng CSS trong '