Chrome 36でWeb ComponentsのHTML Importsが使えるようになり、Web Componentsのすべての要素が普通に使えるようになりました。そこで、Web Componentsのすべての要素(HTML Imports、Template、Shadow DOM、Cuntom Elements)を使ってデバイスピクセル比を表示するサンプルを作ってみました。 まず、コンポーネントの方です。 <template> <style> p { font-size: 3em; } </style> <div> <p>デバイスピクセル比: <span id="devicePixelRatio"></span></p> </div> </template> <script> var ScreenInfoProto = Object.create(HTMLElement.prototy