«twitter-bootstrap» 태그된 질문

Bootstrap은 웹 응용 프로그램 및 사이트 개발을 시작하도록 설계된 프런트 엔드 프레임 워크입니다. Bootstrap 버전과 관련된 질문은 "twitter-bootstrap-2", "twitter-bootstrap-3"및 "bootstrap-4"태그의 특정 버전 태그도 사용하십시오.

30
Twitter Bootstrap 3을 사용하여 열 중심
Twitter Bootstrap 3 의 컨테이너 (12 열) 내에서 한 열 크기의 div를 가운데에 배치하려면 어떻게합니까? .centered { background-color: red; } <body class="container"> <div class="col-lg-1 col-offset-6 centered"> <img data-src="holder.js/100x100" alt="" /> </div> </body> 코드 스 니펫 실행결과 숨기기스 니펫 확장 컨테이너 내에서 div클래스 .centered를 중심으로 하는을 원합니다 . 여러 개가있는 경우 …
30
부트 스트랩 열을 모두 같은 높이로 만들려면 어떻게합니까?
부트 스트랩을 사용하고 있습니다. 세 개의 기둥을 모두 같은 높이로 만들려면 어떻게해야합니까? 다음은 문제의 스크린 샷입니다. 파란색과 빨간색 열이 노란색 열과 같은 높이가 되길 원합니다. 코드는 다음과 같습니다. <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <div class="container-fluid"> <div class="row"> <div class="col-xs-4 panel" style="background-color: red"> some content </div> <div class="col-xs-4 panel" style="background-color: yellow"> catz <img …
23
부트 스트랩 3과 수직 정렬
Twitter Bootstrap 3을 사용하고 있는데 JSFiddle 링크div 와 같이 세로로 두 개를 정렬하려고 할 때 문제가 있습니다 . <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css"> <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <div class="row"> <div class="col-xs-5"> <div style="height:5em;border:1px …
14
jQuery를 사용하여 부트 스트랩 모달 창을 여는 방법은 무엇입니까?
Twitter Bootstrap 모달 창 기능을 사용하고 있습니다. 누군가가 양식에서 제출을 클릭하면 양식에서 "제출 버튼"을 클릭하면 모달 창을 표시하고 싶습니다. <form id="myform" class="form-wizard"> <h2 class="form-wizard-heading">BootStap Wizard Form</h2> <input type="text" value=""/> <input type="submit"/> </form> <!-- Modal --> <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" …
6
Bootstrap 3의 SR 전용은 무엇입니까?
수업은 무엇입니까 sr-only? 중요합니까 아니면 제거 할 수 있습니까? 없이 잘 작동합니다. 내 예는 다음과 같습니다. <div class="btn-group"> <button type="button" class="btn btn-info btn-md">Departments</button> <button type="button" class="btn btn-info dropdown-toggle btn-md" data-toggle="dropdown"> <span class="caret"></span> <span class="sr-only">Toggle Dropdown</span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Sales</a></li> <li><a href="#">Technical</a></li> <li class="divider"></li> <li><a href="#">Show all</a></li> </ul> </div>
20
테이블 내부의 텍스트 정렬 클래스
Twitter의 부트 스트랩 프레임 워크에 텍스트를 정렬하는 클래스 세트가 있습니까? 예를 들어, $오른쪽에 정렬하려는 총계 가있는 테이블 이 있습니다 ... <th class="align-right">Total</th> 과 <td class="align-right">$1,000,000.00</td>
30
배경 아래에 나타나는 부트 스트랩 모달
Bootstrap 예제에서 직접 모달 코드를 사용했으며 bootstrap.js 만 포함하고 bootstrap-modal.js는 포함하지 않았습니다. 그러나 내 모달이 회색 페이드 (배경) 아래에 나타나고 편집 할 수 없습니다. 그 모습은 다음과 같습니다. 이 문제를 재현 하는 한 가지 방법 은 이 바이올린 을 참조하십시오 . 해당 코드의 기본 구조는 다음과 같습니다. <body> <p>Lorem ipsum …
23
Twitter Bootstrap을 사용하여 중앙 집중식 컨텐츠를 얻는 방법은 무엇입니까?
매우 기본적인 예를 따르려고합니다. 시작 페이지와 그리드 시스템을 사용하여 다음을 기대했습니다. <div class="row"> <div class="span12"> <h1>Bootstrap starter template</h1> <p>Example text.</p> </div> </div> 코드 스 니펫 실행결과 숨기기스 니펫 확장 ... 중심 텍스트를 생성합니다. 그러나 여전히 맨 왼쪽에 나타납니다. 내가 무엇을 잘못하고 있지?
11
Twitter Bootstrap Modal에 함수 바인딩 닫기
새 프로젝트에서 Twitter Bootstrap lib를 사용하고 있으며 페이지의 일부를 모달 닫기에서 최신 json 데이터를 새로 고치고 검색하려고합니다. 나는 누군가가 그것을 지적하거나 해결책을 제안 할 수있는 문서의 어느 곳에서도 이것을 보지 못한다. 문서화 된 방법을 사용할 때의 두 가지 문제 $('#my-modal').bind('hide', function () { // do something ... }); 모달에 "숨기기"클래스를 …
10
부트 스트랩 모달에 데이터 전달
각각 ID가 첨부 된 몇 개의 하이퍼 링크가 있습니다. 이 링크를 클릭하면 모달 ( http://twitter.github.com/bootstrap/javascript.html#modals )을 열고이 ID를 모달에 전달하려고합니다. Google에서 검색했지만 도움이 될만한 것을 찾을 수 없었습니다. 이것은 코드입니다. <a data-toggle="modal" data-id="@book.Id" title="Add this item" class="open-AddBookDialog"></a> 열어야 할 것 : <div class="modal hide" id="addBookDialog"> <div class="modal-body"> <input type="hidden" name="bookId" …
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.