jade/page-contents/checkboxes_content.html - v1-dev - githubmirror/materialize

jade/page-contents/checkboxes_content.html
108 строк3 KB
Chang Alan
changed carbon ad code
25 май 2018, 00:33
25 май 2018, 00:33c72138e
<div class="container">
  <div class="row">

    <div class="col s12 m8 offset-m1 xl7 offset-xl1">

      <!-- Checkboxes -->
      <div id="checkbox" class="section scrollspy">
        <p>Use checkboxes when looking for yes or no answers. The <code class="language-markup">for</code> attribute is necessary to bind our custom checkbox with the input. Add the input's <code class="language-markup">id</code> as the value of the <code class="language-markup">for</code> attribute of the label. </p>
        <form action="#">
          <p>
            <label>
              <input type="checkbox" />
              <span>Red</span>
            </label>
          </p>
          <p>
            <label>
              <input type="checkbox" checked="checked" />
              <span>Yellow</span>
            </label>
          </p>
          <p>
            <label>
              <input type="checkbox" class="filled-in" checked="checked" />
              <span>Filled in</span>
            </label>
          </p>
          <p>
            <label>
              <input id="indeterminate-checkbox" type="checkbox" />
              <span>Indeterminate Style</span>
            </label>
          </p>
          <p>
            <label>
              <input type="checkbox" checked="checked" disabled="disabled" />
              <span>Green</span>
            </label>
          </p>
          <p>
            <label>
              <input type="checkbox" disabled="disabled" />
              <span>Brown</span>
            </label>
          </p>
        </form>

        <br>
        <pre><code class="language-markup">
  &lt;form action="#">
    &lt;p>
      &lt;label>
        &lt;input type="checkbox" />
        &lt;span>Red&lt;/span>
      &lt;/label>
    &lt;/p>
    &lt;p>
      &lt;label>
        &lt;input type="checkbox" checked="checked" />
        &lt;span>Yellow&lt;/span>
      &lt;/label>
    &lt;/p>
    &lt;p>
      &lt;label>
        &lt;input type="checkbox" class="filled-in" checked="checked" />
        &lt;span>Filled in&lt;/span>
      &lt;/label>
    &lt;/p>
    &lt;p>
      &lt;label>
        &lt;input id="indeterminate-checkbox" type="checkbox" />
        &lt;span>Indeterminate Style&lt;/span>
      &lt;/label>
    &lt;/p>
    &lt;p>
      &lt;label>
        &lt;input type="checkbox" checked="checked" disabled="disabled" />
        &lt;span>Green&lt;/span>
      &lt;/label>
    &lt;/p>
    &lt;p>
      &lt;label>
        &lt;input type="checkbox" disabled="disabled" />
        &lt;span>Brown&lt;/span>
      &lt;/label>
    &lt;/p>
  &lt;/form>
        </code></pre>
      </div>


    </div>
    <div class="col hide-on-small-only m3 xl3 offset-xl1">
      <div class="toc-wrapper">
        <div class="buysellads hide-on-small-only">
          <!-- CarbonAds Zone Code -->
          <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?serve=CKYIK27J&placement=materializecss" id="_carbonads_js"></script>
        </div>
        <div style="height: 1px;">
          <ul class="section table-of-contents">
            <li><a href="#checkbox">Checkboxes</a></li>
          </ul>
        </div>
      </div>
    </div>

  </div>
</div>