Materialize CSS에 - DOM의 이름이나 적절한 값이 없습니다.

Question

CSS <select> 태그가 어떻게 작동하는지 이해하는 데 문제가 있습니다.

일반 HTML 선택 태그에서 name="" 속성을 삽입하고 각 옵션에 대해 구체화 CSS에없는 것으로 보이는 value="" 속성을 삽입합니다.

이 코드 :

<div class="input-field col s12"> 
    <select> 
    <option value="" disabled selected>Choose your option</option> 
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option> 
    <option value="3">Option 3</option> 
    </select> 
    <label>Materialize Select</label> 
</div> 

는 DOM이로 렌더링 :

<div class="input-field col s12 m6"> 
    <div class="select-wrapper"><span class="caret">▼</span> 
    <input class="select-dropdown" readonly="true" data-activates="select-options-273ec07d-e7c4-e689-e2e3-6a57ff2f6293" value="Choose your option" type="text"> 
    <ul style="width: 296px; position: absolute; top: 0px; left: 0px; opacity: 1; display: none;" id="select-options-273ec07d-e7c4-e689-e2e3-6a57ff2f6293" class="dropdown-content select-dropdown"> 
     <li class="disabled"><span>Choose your option</span></li><li class="active selected"><span>Option 1</span></li><li class=""><span>Option 2</span></li> 
     <li class=""><span>Option 3</span></li> 
    </ul> 
    <select class="initialized"> 
      <option value="" disabled="" selected="">Choose your option</option> 
      <option value="1">Option 1</option> 
      <option value="2">Option 2</option> 
      <option value="3">Option 3</option> 
    </select> 
    </div> 
    <label>Materialize Select</label> 
</div> 

문제 난 데를 :

1. 어떻게 내가 그 선택 요소에 대한 이름을 설정 할 (그에 따라 표현 된 input 요소에서 나타 내기 위해)?
2. 값은 목록에 표시되는 텍스트입니다. 내가 예컨대, 디스플레이 문자열과 다른 가치를 원하는 모든 사전 :에

<option value="1">regular style</option> <option value="2">bold style</option> <option value="3">italic style</option>

감사를 구체화 대부분의 다른 도서관 등의 <select> 교체를 처리

Answer 1

; name="foo" 또는 <option value="A">But I'm showing other text here</option>과 같은 표준 HTML 규칙을 따르십시오.

출력물은 더 예쁘고 기능적인 양식을 만들 때이를 고려합니다.

주 다음 구체화 CSS 문서는 공통 요소 (name=""를 같은)의 대부분없이 <select> 태그를 보여 않습니다,하지만이 가능 깨끗한, 가장 최소한의 코드를 제시하는 것이 더 생각합니다.