简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집> 웹 프론트엔드> 프런트엔드 Q&A> 본문

부트스트랩의 모달 상자는 어디에 있나요?

WBOY
풀어 주다： 2022-08-01 17:55:40
원래의
1623명이 탐색했습니다.

Bootstrap의 모달 상자는 상위 양식에 오버레이되며 하위 양식입니다. 모달 상자의 목적은 별도 소스의 콘텐츠를 표시하고 상위 양식을 떠나지 않고도 일부 상호 작용을 허용하는 것입니다. ".modal-sm" 클래스를 추가하여 작은 모달 상자를 만들고, ".modal-lg" 클래스를 추가하여 큰 모달 상자를 만들 수 있습니다.

부트스트랩의 모달 상자는 어디에 있나요?

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

부트스트랩의 모달 상자는 무엇입니까?

모달 상자(Modal)는 상위 항목에 겹쳐져 있습니다. 양식 하위 양식.일반적으로 목적은 상위 양식을 떠나지 않고도 상호 작용이 가능한 별도 소스의 콘텐츠를 표시하는 것입니다. 하위 양식은 정보 상호 작용 등을 제공할 수 있습니다.

모달 상자를 만드는 방법

다음 예에서는 간단한 모달 상자 효과를 만듭니다.

   Bootstrap 实例       

  
 
模态框实例
로그인 후 복사

출력 결과:

부트스트랩의 모달 상자는 어디에 있나요?

모달 상자 크기

를 추가하여 .modal-sm을 추가할 수 있습니다. modal-sm 클래스는 작은 모달 상자를 만들고, .modal-lg 클래스는 큰 모달 상자를 만듭니다.

size 클래스는

요소의 .modal-dialog 클래스 뒤에 배치됩니다. 

   Bootstrap 实例       

  
 
模态框实例
로그인 후 복사

출력 결과:

부트스트랩의 모달 상자는 어디에 있나요?

관련 권장 사항:부트스트랩 튜토리얼

위 내용은 부트스트랩의 모달 상자는 어디에 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨：
bootstrap
원천：php.cn
이전 기사：html5에 여러 양식이 있을 수 있나요? 다음 기사：html5는 오프라인 애플리케이션을 지원합니까?
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
Nuxt.js에 jQuery를 설치하는 단계 프로젝트에 jQuery를 추가하려고 하는데 정의되지 않았다는 오류가 발생합니다. 플러그인:[{src:'~/plugins/js/svgSprite.js',mode:'...
에서 2023-11-06 16:41:50
0
1
225
npm run dev를 실행한 후에도 Laravel 9는 여전히 App.css 및 App.js를 찾을 수 없습니다. Laravel을 처음 접하는 저는 시작하기 전에 실제로 Laravel9에 대한 문서를 살펴보았는지 확인했지만, 놓친 경우를 대비해 제공된 링크에서 app.css ...
에서 2023-10-26 23:41:22
0
1
489
Bootstrap 4의 그리드 시스템 중단점 사용자 정의 디자인에 데스크톱에서 태블릿으로 또는 xl에서 lg로 각각 1280개의 중단점이 필요한 응용 프로그램이 있습니다. 그러나 Bootstrap 자체에는 1200에 x...
에서 2023-10-18 23:01:50
0
2
197
헤더 이미지, 텍스트, 버튼을 반응형으로 만드는 방법 Bootstrap5를 사용하여 웹사이트를 만들고 있습니다. 웹사이트 헤더에서는 Bootstrap의 캐러셀을 헤더로 사용하고 있습니다. 캐러셀 이미지를 사용하면 텍...
에서 2023-09-17 09:51:15
0
1
283
내 Bootstrap 탐색 모음이 올바르게 렌더링되지 않는 이유는 무엇입니까? Bootstrap4를 사용하여 탐색 모음을 만들려고 하는데 코드가 작동하지 않는 것 같습니다. 내 코드는 nav 브랜드에 대한 몇 가지 변경 사항만 제외하면 튜토...
에서 2023-09-16 16:14:06
0
1
522
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！