입력 제출 버튼 추가

입력 텍스트 형식의 입력을 확인하는 데 사용되는 입력 버튼이 있습니다.입력 제출 버튼 추가

예를 들어, 부트 스트랩을 사용하면 입력 할 값을 추가 할 수 있습니다. 유형 텍스트 입력에이 유형 버튼 입력을 어떻게 추가 할 것인지 궁금합니다.

내가 어떻게 생각하고 있는지 스크린 샷을 추가했지만 어떤 CSS 전략을 선택해야할지 모르겠다.

감사

enter image description here

출처

2012-12-11 Hommer Smith

콘솔을 열어 부트 스트랩에서 어떻게했는지보십시오. –

내가 정말로 오해하고있는 것이 아니라면,'button '은'input' 요소 옆에 * 있다고 생각합니다. ('button'은 input 요소 안에 있었을 것입니다. 할 수 없다). –

그것은 텍스트 필드

Demo

HTML

<div class="wrap"> 
    <input type="text" /> 
    <input type="button" value="Demo" /> 
</div>

CSS

와 제출 버튼에 불과하다

.wrap { 
    display: inline-block; 
    position: relative; 
} 

input[type=text] { 
    padding: 10px; 
    width: 300px; 
    padding-right: 60px; 
} 

input[type=button] { 
    padding: 2px; 
    position: absolute; 
    right: 5px; 
    top: 5px; 
}

출처

2012-12-11 16:49:32

다음은 샘플 코드입니다. 도움이 될 것입니다.

<form class="form-search pull-right"> 
     <div class="input-append"> 
      <input type="text" class="span2 search-query"> 
      <button type="submit" class="btn">Validate</button> 
     </div> 
</form>

부트 스트랩에는 두 가지 기능이 더 있습니다. 추가 및 앞에 추가하십시오. Prepend는 텍스트 필드 앞에 버튼을 추가하고 append는 텍스트 필드 뒤에 버튼을 추가합니다. 둘 다 합류했습니다!

당신이해야 할 일은 부트 스트랩 파일을로드하고 위의 코드를 html/php 파일에 추가하기 만하면됩니다. 너 끝났어!

출처

2012-12-11 16:50:22 trollster

내가 무례하다면 미안하지만 누구든지이 대답을 부인했다면 부트 스트랩 사이트의 코드를 확인하십시오. http://twitter.github.com/bootstrap/base-css.html#forms – trollster

당신이 부트 스트랩 설치를 제안하고 있기 때문에 나는 그것을 downvoted, 그리고 그 대답은 아닙니다. 그는 자신의 CSS에서 부트 스트랩의 기능을 에뮬레이션하는 방법을 알고 싶어합니다. –

그는 부트 스트랩에 값을 추가하는 것에 대해 이야기하고 입력 필드에 버튼을 추가하는 방법을 알고 싶었 기 때문에 그에 대한 답을주었습니다. 그가해야만하는 일은 부트 스트랩 파일, 필요한 클래스를 확인하고 거기에서 값을 가져 와서 재생하고 자신의 커스텀 css 파일에서 사용하기 시작한 다음 직접 할 수 없다면 부트 스트랩 자체를 직접 사용하는 것입니다. 내가 잘못 해석 한 것 같아요. 신경 쓰지 마. 죄송합니다. 그러나 사물을 바라보고 그것을 발견하는 것은 그의 책임이었다. – trollster

입력 제출 버튼 추가

답변

관련 문제