부트스트랩 스타일 버튼이란 무엇입니까?

부트스트랩 스타일 버튼에는 다음이 포함됩니다. 1. ".btn" 둥근 회색 버튼 2. ".btn-lg" 큰 버튼 3. ".btn-sm" 작은 버튼; 버튼 5. ".btn-block" 블록 수준 버튼 6. ".disabled" 비활성화된 스타일 버튼 등

이 튜토리얼의 운영 환경: Windows 7 시스템, 부트랩 버전 3.3.7, DELL G3 컴퓨터

부트스트랩 버튼 스타일 요약

클래스 스타일	Description
.btn	둥근 회색 버튼, 버튼을 덜 날카롭게 만들기 위해 버튼은 모두 이 스타일을 사용하여 둥근 모양의 모서리를 만든 다음 다른 기능과 오버레이합니다.
.btn-default	기본/표준 버튼, 흰색 버튼을 누르면 회색으로 변합니다.
.btn-primary	원래 버튼 스타일(조작하지 않음), 액티브에 해당하며, 조작되지 않은 버튼의 스타일이고, 액티브는 버튼을 클릭했을 때 표시되는 해당 스타일입니다.
.btn-success	는 성공적인 작업을 나타냅니다.
.btn-info	이 스타일은 정보를 표시하려는 버튼에 사용할 수 있습니다.
.btn-warning	은 다음과 같은 버튼을 나타냅니다.
.btn-danger	는 위험한 동작 버튼 동작을 나타냅니다.
.btn-link	버튼을 링크처럼 보이게 합니다(여전히 버튼 동작을 유지합니다)
.btn- lg	큰 버튼
.btn-sm	작은 버튼
.btn-xs	아주 작은 버튼
.btn-block	블록 수준 버튼(100까지 확장) % 상위 요소의 너비)
.active	버튼을 클릭하면 버튼이 활성화될 때 누른 모양(어두운 배경, 어두운 테두리, 그림자)이 됩니다.
.disabled	버튼을 비활성화하면 색상이 50% 더 밝아지고 그라데이션이 손실됩니다.

기본 버튼 그룹

<div class="btn-group">
    <button type="button" class="btn btn-default">按钮 1</button>
    <button type="button" class="btn btn-default">按钮 2</button>
    <button type="button" class="btn btn-default">按钮 3</button>
</div>

버튼 크기

<div class="btn-group btn-group-lg">
	<button type="button" class="btn btn-default">Button 1</button>
	<button type="button" class="btn btn-default">Button 2</button>
	<button type="button" class="btn btn-default">Button 3</button>
</div>
<div class="btn-group btn-group-sm">
	<button type="button" class="btn btn-default">Button 4</button>
	<button type="button" class="btn btn-default">Button 5</button>
	<button type="button" class="btn btn-default">Button 6</button>
</div>
<div class="btn-group btn-group-xs">
	<button type="button" class="btn btn-default">Button 7</button>
	<button type="button" class="btn btn-default">Button 8</button>
	<button type="button" class="btn btn-default">Button 9</button>
</div>

부트스트랩에 대한 더 많은 관련 지식을 보려면 부트스트랩 기본 튜토리얼을 방문하세요! !

위 내용은 부트스트랩 스타일 버튼이란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!