third_party/polymer/components-chromium/core-label/core-label.html

   1 <!--
   2     @license
   3     Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
   4     This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
   5     The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
   6     The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
   7     Code distributed by Google as part of the polymer project is also
   8     subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
   9 --><!--
  10 `<core-label>` provides a version of the `<label>` element that works with Custom Elements as well as native elements.
  11
  12 All text in the `core-label` will be applied to the target element as a screen-reader accessible description.
  13
  14 There are two ways to use `core-label` to target an element:
  15
  16 1. place an element inside core-label with the `for` attribute:
  17
  18         <core-label>
  19           Context for the Button
  20           <paper-button for>button</paper-button>
  21         </core-label>
  22
  23 2. Set the `for` attribute on the `core-label` element to point to a target element in the same scope with a query
  24 string:
  25
  26         <core-label for=".foo">
  27           Context for the button witht the "foo" class"
  28         </core-label>
  29         <paper-button class="foo">Far away button</paper-button>
  30
  31 All taps on the `core-label` will be forwarded to the "target" element.
  32
  33 @group Core Elements
  34 @element core-label
  35 @homepage github.io
  36 --><html><head><link rel="import" href="../polymer/polymer.html">
  37
  38 <!-- Native <label> has cursor: default -->
  39 <style>
  40   html /deep/ core-label {
  41     cursor: default;
  42   }
  43 </style>
  44
  45 </head><body><polymer-element name="core-label" assetpath="">
  46
  47 </polymer-element>
  48 <script charset="utf-8" src="core-label-extracted.js"></script></body></html>