어떻게 부트 스트랩을 사용하여 사용자 지정 단추를 만들 수 있습니까? 견적보기 단추에는 왼쪽에 돋보기 기호가 있어야하며, 마찬가지로 다음 단추와 같이 지우기 단추에는 왼쪽에 기호가 있어야합니다. 또한 견적보기 버튼의 색상을 변경하여 하늘색으로 변경하는 방법.부트 스트랩을 사용하여 사용자 지정 단추를 만드는 방법은 무엇입니까?
가져 오기 견적 및 삭제 버튼 이미지 : 부트 스트랩 4에서
, 그들은 dropped the Glyphicon icons. 당신은 사용할 수 있습니다
이의 업스트림 버전으로, 당신은 http://fontawesome.io/examples/을 체크 아웃 할 수있는 예는 주어진와 글꼴 최고 아이콘 통합 부트 스트랩 3 버튼. 마찬가지로 Bootstrap 4 버튼을 사용하여 수행 할 수 있습니다. 제공된 코드 스 니펫을 확인하십시오.
또한 버튼 색상을 available options과 다른 맞춤 색상으로 변경하려면 분명히 CSS를 변경해야합니다. 더 좋은 방법은 소스의 SASS 파일을 통해 믹스 인을 사용하여 새로운 사용자 정의 버튼을 생성하는 것입니다. 몇 가지 아이디어를 얻기 위해 아래의 링크를 체크 아웃 :
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
<a class="btn btn-info" href="#">
<i class="fa fa-search"></i> Get Quote
</a>
<a class="btn btn-secondary" href="#">
<i class="fa fa-refresh"></i> Clear
</a>모두 신선한 경험이 풍부한 사람에게 유용한이 웹 사이트를보십시오. 좋은 튜토리얼.
https://www.w3schools.com/bootstrap/bootstrap_buttons.asp