> 웹 프론트엔드 > 부트스트랩 튜토리얼 > 부트스트랩에서 아이콘을 삭제하는 방법

부트스트랩에서 아이콘을 삭제하는 방법

藏色散人
풀어 주다: 2021-01-08 14:36:01
원래의
2485명이 탐색했습니다.

부트스트랩에서 아이콘을 삭제하는 방법: 먼저 해당 코드 파일을 연 다음 특정 CSS 클래스 또는 의사 클래스의 배경 속성을 없음으로 설정하여 아이콘을 삭제하면 됩니다.

부트스트랩에서 아이콘을 삭제하는 방법

이 튜토리얼의 운영 환경: Windows 7 시스템, bootsrap 버전 3.3.7 이 방법은 모든 브랜드의 컴퓨터에 적합합니다.

추천: "bootstrap tutorial" "css video tutorial"

Bootstrap 확인 아이콘 삭제

특정 질문:

Bootstrap의 확인 아이콘("x" 및 ")을 삭제하려고 합니다. 확인" "), 모든 것을 조사했지만 어디에 있는지 찾을 수 없습니다.

이 JSFiddle도 여기서 볼 수 있습니다.

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
<form class="was-validated">
  <div class="form-group">
    <select class="custom-select" required>
      <option value="">Open this select menu</option>
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
    </select>
    <div class="invalid-feedback">Example invalid custom select feedback</div>
  </div>
</form>
로그인 후 복사

구현 방법:

특정 CSS 클래스/의사 클래스의 배경 속성을 없음으로 설정하여 아이콘을 간단히 제거할 수 있습니다.

.was-validated .custom-select:valid {
  background-image: none;
}
.was-validated .custom-select:invalid {
  background-image: none;
}
로그인 후 복사

유효성 검사 아이콘을 제거하고 싶지만 화살표 아이콘은 그대로 유지하는 경우 선택 입력을 사용하려면 배경을 다음 콘텐츠로 설정하면 됩니다.

.was-validated .custom-select:invalid {
     background: url("data:image/svg+xml,%3csvg xmlns=&#39;http://www.w3.org/2000/svg&#39; viewBox=&#39;0 0 4 5&#39;%3e%3cpath fill=&#39;%23343a40&#39; d=&#39;M2 0L0 2h4zm0 5L0 3h4z&#39;/%3e%3c/svg%3e") no-repeat right .75rem center/8px 10px;
}
로그인 후 복사

더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 교육을 방문하세요! !

위 내용은 부트스트랩에서 아이콘을 삭제하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿