스와이퍼 플러그인에서 화살표 버튼을 전환하는 방법
이번에는 스와이퍼 플러그인으로 화살표 버튼을 전환하는 방법을 보여드리고, 스와이퍼 플러그인으로 화살표 버튼을 전환할 때의 주의사항은 무엇인지 살펴보겠습니다. .
즉, 왼쪽 및 오른쪽 전환 화살표를 컨테이너 외부로 이동하고 화살표 스타일을 사용자 정의해야 합니다.
스위퍼 컨테이너에 상위 컨테이너를 추가하고 두 컨테이너 사이에 간격을 두고 간격 사이에 화살표를 배치하면 괜찮습니다.
화살표는 기본적으로 절대 위치입니다. 상위 컨테이너에 상대 위치를 지정하여 화살표 위치를 조정할 수 있습니다. 또한 화살표는 배경 이미지를 사용합니다. 화살표의 크기를 변경할 때는 배경 이미지의 크기도 변경해야 합니다. 코드를 올려보세요.
CSS:
<style>
.out_container{
width: 280px;
height: 150px;
margin: 100px auto;
position: relative;
outline: 1px solid black;
}
.in_container{
width: 216px;
height: 130px;
margin: 0 auto;
overflow: hidden;
}
.swiper_btn{
width: 20px;
height: 20px;
background-size: contain;
}
</style>HTML:
<body> <p class="out_container"> <p class="in_container"> <p class="swiper-wrapper"> <p class="swiper-slide"><img src="" alt=""></p> <p class="swiper-slide"><img src="" alt=""></p> <p class="swiper-slide"><img src="" alt=""></p> </p> <p class="swiper-button-prev swiper_btn"></p> <p class="swiper-button-next swiper_btn"></p> </p> </p> </body>
js:
<script>
var mySwiper = new Swiper('.in_container', {
prevButton: '.swiper-button-prev',
nextButton: '.swiper-button-next',
})
</script>이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!
추천 도서:
vue.js 데이터 전송 및 데이터 배포 단계에 대한 자세한 설명
위 내용은 스와이퍼 플러그인에서 화살표 버튼을 전환하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
AI Hentai Generator
AI Hentai를 무료로 생성하십시오.
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7478
15
1377
52
77
11
50
19
19
33
Windows 11에서 바로가기 화살표 아이콘을 제거하는 방법
Dec 28, 2023 am 10:39 AM
많은 사용자들이 최신 win11 시스템을 사용하다 보면 바탕화면의 바로가기 아이콘에 작은 화살표가 나타나서 모양에 영향을 미치게 되므로, 혹시라도 win11 바로가기 아이콘에서 작은 화살표를 없애는 방법에 대한 튜토리얼을 가져왔습니다. 보기에 좋지 않습니다. 어떻게 작동하는지 살펴보겠습니다. win11에서 작은 단축키 화살표를 제거하는 방법: 1. 먼저 키보드의 "win+r" 단축키를 동시에 누릅니다. 2. 그런 다음 "실행"을 열고 "regedit" 명령을 입력한 다음 "확인" 버튼을 클릭합니다. 3. 그런 다음 "레지스트리 편집기" 페이지에 들어가서 다음을 클릭하여 엽니다: HKEY_CLASSES_ROOT\lnkfile(복사하여 붙여넣기 가능) 4. 재입력 후 "lsShortcut"을 마우스 오른쪽 버튼으로 클릭 후 선택
Win10에서 바로가기 아이콘의 작은 화살표를 빠르게 복원하는 방법 누락된 바로가기 아이콘에 대한 해결책은 무엇입니까?
Feb 29, 2024 pm 04:46 PM
이번 글에서는 Win10에서 바로가기 아이콘의 작은 화살표를 복원하는 방법을 소개하겠습니다. 바로가기 아이콘의 작은 화살표는 해당 파일이나 폴더가 원본 파일이나 폴더가 아닌 바로가기임을 나타냅니다. 바로가기 아이콘의 작은 화살표가 사라지면 사용자가 어떤 파일이나 폴더가 바로가기인지 식별하기가 혼란스럽고 어려울 수 있습니다. 이 문서에서는 사용자가 바로가기 아이콘의 작은 화살표를 쉽게 복원하는 데 도움이 되는 자세한 단계를 제공합니다. 바로가기 아이콘의 작은 화살표 복원 팁 1. Win10 시스템에서는 기본적으로 바탕화면 바로가기 아이콘에 작은 화살표가 표시되지만 일부 사용자는 바로가기 아이콘의 작은 화살표가 이상하게 사라지는 현상을 발견했습니다. 빈 곳에서 [마우스 오른쪽 버튼 클릭]을 클릭하고 나타나는 마우스 오른쪽 버튼 메뉴 항목에서 [새 텍스트]를 선택합니다.
Xiaomi Mi 14Ultra에서 4g와 5g 사이를 전환하는 방법은 무엇입니까?
Feb 23, 2024 am 11:49 AM
Xiaomi 14Ultra는 올해 가장 인기 있는 Xiaomi 모델 중 하나입니다. Xiaomi 14Ultra는 프로세서와 다양한 구성을 업그레이드할 뿐만 아니라 사용자에게 많은 새로운 기능 애플리케이션을 제공합니다. 이는 Xiaomi 14Ultra 휴대폰의 판매에서 확인할 수 있습니다. 많이 사용되는 기능이지만 아직은 모르실 수도 있는 일반적으로 사용되는 기능이 있습니다. 그렇다면 Xiaomi 14Ultra는 어떻게 4g와 5g 사이를 전환합니까? 구체적인 내용을 아래에서 소개해드리겠습니다! Xiaomi 14Ultra에서 4g와 5g 사이를 전환하는 방법은 무엇입니까? 1. 휴대폰의 설정 메뉴를 엽니다. 2. 설정 메뉴에서 '네트워크' 및 '모바일 네트워크' 옵션을 찾아서 선택하세요. 3. 모바일 네트워크 설정에 '기본 네트워크 유형' 옵션이 표시됩니다. 4. 이 옵션을 클릭하거나 선택하면 다음과 같은 내용이 표시됩니다.
win11 홈 버전에서 프로페셔널 버전으로 전환하기 위한 조작 튜토리얼_win11 홈 버전에서 프로페셔널 버전으로 전환하기 위한 조작 튜토리얼
Mar 20, 2024 pm 01:58 PM
Win11 Home Edition을 Win11 Professional Edition으로 변환하는 방법 Win11 시스템은 Home Edition, Professional Edition, Enterprise Edition 등으로 나뉘며 대부분의 Win11 노트북에는 Win11 Home Edition 시스템이 사전 설치되어 있습니다. 오늘은 에디터가 win11 홈버전에서 프로페셔널 버전으로 전환하는 단계를 보여드리겠습니다! 1. 먼저, win11 바탕화면과 속성에서 이 컴퓨터를 마우스 오른쪽 버튼으로 클릭하세요. 2. 제품 키 변경 또는 Windows 업그레이드를 클릭합니다. 3. 입력 후 제품키 변경을 클릭하세요. 4. 활성화 키: 8G7XN-V7YWC-W8RPC-V73KB-YWRDB를 입력하고 다음을 선택합니다. 5. 그러면 성공이 보장되므로 win11 홈 버전을 win11 프로페셔널 버전으로 업그레이드할 수 있습니다.
Win10 시스템에서 이중 시스템 전환을 구현하는 방법
Jan 03, 2024 pm 05:41 PM
많은 친구들이 Win 시스템을 처음 접했을 때 익숙하지 않을 수 있습니다. 현재 컴퓨터에는 이중 시스템이 있습니다. 이제 두 시스템 사이를 전환하는 자세한 단계를 살펴보겠습니다. 두 시스템 사이. win10 시스템에서 두 시스템 간 전환하는 방법 1. 단축키 전환 1. "win" + "R" 키를 눌러 실행을 엽니다. 2. 실행 상자에 "msconfig"를 입력하고 "확인"을 클릭합니다. 3. 열린 창에서 " 시스템 구성" 인터페이스에서 필요한 시스템을 선택하고 "기본값으로 설정"을 클릭합니다. 완료 후 "다시 시작"을 클릭하면 스위치가 완료됩니다. 방법 2. 부팅 시 스위치 선택 1. 듀얼 시스템이 있는 경우 선택 작업 인터페이스 부팅할 때 나타납니다. 키보드의 위쪽 및 아래쪽 키를 사용하여 시스템을 선택할 수 있습니다.
vue3에서 swiper를 사용할 때 발생하는 문제를 해결하는 방법
May 11, 2023 pm 01:07 PM
1. swiper를 사용하여 swpier 플러그인 npminstallswiper-s//@9.2.0//을 설치하거나 지정된 버전 npminstallswiper@8.4.7-s를 설치합니다. 2. swiper를 사용하여 참조 방법을 직접 따릅니다. 공식 웹사이트에서 오류를 보고합니다. 솔루션: 도입됨 구성요소는 import{Swiper,SwiperSlide}from "swiper/vue/swiper-vue"를 사용합니다. import "swiper/swiper.min.css";
Apple 컴퓨터의 이중 시스템 부팅 모드 전환
Feb 19, 2024 pm 06:50 PM
Apple 컴퓨터를 시작할 때 Apple 듀얼 시스템 간을 전환하는 방법 Apple 컴퓨터는 자체 macOS 운영 체제를 실행하는 것 외에도 Windows와 같은 다른 운영 체제를 설치하도록 선택하여 듀얼 시스템 전환을 달성할 수도 있습니다. 그렇다면 부팅할 때 두 시스템 간에 어떻게 전환합니까? 이 문서에서는 Apple 컴퓨터에서 듀얼 시스템 간에 전환하는 방법을 소개합니다. 먼저 듀얼 시스템을 설치하기 전에 Apple 컴퓨터가 듀얼 시스템 전환을 지원하는지 확인해야 합니다. 일반적으로 Apple 컴퓨터는 다음을 기반으로 합니다.
Excel에서 통합 문서 전환에 바로 가기 키를 사용하는 방법
Mar 20, 2024 pm 01:50 PM
Excel 소프트웨어를 적용할 때 우리는 일부 작업을 보다 쉽고 빠르게 수행하기 위해 단축키를 사용하는 데 익숙합니다. 때로는 Excel의 여러 테이블 간에 관련 데이터가 있을 때 작업 간에 지속적으로 전환해야 합니다. 빠른 전환 방법을 사용하면 전환에 소요되는 시간을 많이 절약할 수 있어 작업 효율을 크게 높일 수 있습니다. 빠른 전환을 완료하려면 어떤 방법을 사용할 수 있나요? 오늘 편집자는 이에 대해 이야기하겠습니다. 내용은 다음과 같습니다. Excel에서 통합 문서를 전환하기 위해 바로 가기 키를 사용합니다. 1. 먼저 열려 있는 엑셀 표 하단에 여러 개의 통합 문서가 표시됩니다. 아래 그림과 같이 여러 통합 문서 사이를 빠르게 전환해야 합니다. 2. 그런 다음 이동하지 않고 키보드의 Ctrl 키를 누르고 필요한 경우 오른쪽에 있는 작업을 선택합니다.
