수직 중심화 부트스트랩 모달 창
나는 뷰포트(가운데)에 내 모달을 중심으로 하고 싶습니다. 나는 몇몇 css 속성을 추가하려고 했습니다.
.modal { position: fixed; top:50%; left:50%; }
이 예제를 사용하고 있습니다. http://jsfiddle.net/rniemeyer/Wjjnd/
나는 노력했다.
$("#MyModal").modal('show').css(
{
'margin-top': function () {
return -($(this).height() / 2);
},
'margin-left': function () {
return -($(this).width() / 2);
}
})
이렇게 하면 작업이 수행됩니다. http://jsfiddle.net/sRmLV/1140/
helper-div와 일부 사용자 지정 CSS를 사용합니다.Javascript 또는 jQuery가 필요하지 않습니다.
HTML(Bootstrap의 데모 코드 기반)
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">Launch demo modal</button>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="vertical-alignment-helper">
<div class="modal-dialog vertical-align-center">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">...</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
</div>
CSS
.vertical-alignment-helper {
display:table;
height: 100%;
width: 100%;
pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}
.vertical-align-center {
/* To center vertically */
display: table-cell;
vertical-align: middle;
pointer-events:none;
}
.modal-content {
/* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
width:inherit;
max-width:inherit; /* For Bootstrap 4 - to avoid the modal window stretching full width */
height:inherit;
/* To center horizontally */
margin: 0 auto;
pointer-events: all;
}
gpcola의 답변이 나에게 맞지 않아서, 나는 지금 그것이 작동하도록 약간의 편집을 했습니다.저는 변환 대신 "마진 톱"을 사용했습니다.또한, 저는 "보여짐" 이벤트 대신 "보여짐" 이벤트를 사용합니다. 왜냐하면 그것이 저에게 매우 나쁜 위치 지정 점프를 제공했기 때문입니다(부트스트랩 애니메이션이 켜져 있을 때 볼 수 있습니다).배치하기 전에 디스플레이를 "차단"으로 설정하고, 그렇지 않으면 $dialog를 설정해야 합니다.높이()는 0이고 모달이 완전히 중심에 있지 않습니다.
(function ($) {
"use strict";
function centerModal() {
$(this).css('display', 'block');
var $dialog = $(this).find(".modal-dialog"),
offset = ($(window).height() - $dialog.height()) / 2,
bottomMargin = parseInt($dialog.css('marginBottom'), 10);
// Make sure you don't hide the top part of the modal w/ a negative margin if it's longer than the screen height, and keep the margin equal to the bottom margin of the modal
if(offset < bottomMargin) offset = bottomMargin;
$dialog.css("margin-top", offset);
}
$(document).on('show.bs.modal', '.modal', centerModal);
$(window).on("resize", function () {
$('.modal:visible').each(centerModal);
});
}(jQuery));
이것이 제 앱을 위해 제가 한 일입니다.bootstrap.css 파일에서 다음 클래스를 살펴보면 .modal-dialog의 기본 패딩은 10px 및 @media 화면이고 (최소 너비: 768px) .modal-dialog의 최상위 패딩은 30px로 설정됩니다.그래서 저는 맞춤형 CSS 파일에서 미디어 화면 너비를 지정하지 않고 모든 화면에 대해 상단 패딩을 15%로 설정했습니다.이게 도움이 되길 바랍니다.
.modal-dialog {
padding-top: 15%;
}
HTML5 브라우저에 대해 찾은 가장 좋은 방법은 다음과 같습니다.
body.modal-open .modal {
display: flex !important;
height: 100%;
}
body.modal-open .modal .modal-dialog {
margin: auto;
}
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="table">
<div class="table-cell">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
</div>
</div>
스타일
.table {
display: table;
height:100%;
}
.table-cell {
display: table-cell;
vertical-align: middle;
}
부트스트랩 4부터는 JavaScript 없이 이를 달성하기 위해 다음 클래스가 추가되었습니다.
modal-dialog-centered
여기에서 문서를 찾을 수 있습니다.
v.d에서 .modal-dialog-centered를 .modal-dialog에 모두 추가하여 모달을 수직으로 중앙에 배치해야 한다는 점을 지적해 주셔서 감사합니다.
이것은 나에게 완벽하게 효과가 있습니다.
.modal {
text-align: center;
padding: 0!important;
}
.modal:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -4px;
}
.modal-dialog {
display: inline-block;
text-align: left;
vertical-align: middle;
}
완전한 데모 URL: https://codepen.io/dimbslmh/full/mKfCc
선언에 로 적용하기 .fade.in 에서 . 를 합니다.!important키워드를 앞에 붙입니다.이렇게 하면 브라우저는 해당 값을 사용하고 키워드에 대한 다른 값은 무시합니다.이는 다른 곳에서는 값을 재정의할 수 없다는 단점이 있습니다.
.modal {
position: fixed;
top: 50% !important;
left: 50%;
}
대부분의 답변이 효과가 없거나 부분적으로만 효과가 있었기 때문입니다.
body.modal-open .modal[style]:not([style='display: none;']) {
display: flex !important;
height: 100%;
}
body.modal-open .modal[style]:not([style='display: none;']) .modal-dialog {
margin: auto;
}
[style] 선택기를 사용하여 모든 모달 대신 현재 활성화된 모달에만 스타일을 적용해야 합니다..in너무 늦고 정말 나쁜 전환을 만드는 전환이 완료된 후에만 추가되는 것 같습니다.다행히 부트스트랩은 보여주기 시작할 때 항상 모달에 스타일 속성을 적용하는 것처럼 보여서 이것은 약간 진부하지만 작동합니다.
그:not([style='display: none;'])하지 않고 때 입니다.partion의 파일 이름은 "none"입니다.
사용할 수 있는 항목:
.modal {
position: fixed;
top: 50% !important;
left: 50%;
transform: translate(-50%, -50%);
}
수직 및 수평으로 중심을 맞춥니다.
다음과 같이 부트스트랩 3 모달에서 수직 정렬 센터를 달성할 수 있습니다.
.modal-vertical-centered {
transform: translate(0, 50%) !important;
-ms-transform: translate(0, 50%) !important; /* IE 9 */
-webkit-transform: translate(0, 50%) !important; /* Safari and Chrome */
}
그리고 이 css 클래스를 "css-dialog" 컨테이너에 추가합니다.
<div class="modal-dialog modal-vertical-centered">
...
jsFiddle 작업 예제: http://jsfiddle.net/U4NRx/
가장 깨끗하고 간단한 방법은 Flexbox를 사용하는 것입니다!다음은 부트스트랩 3 모달을 화면 중앙에 수직으로 정렬하고 여기에 게시된 다른 모든 솔루션보다 훨씬 깨끗하고 단순합니다.
body.modal-open .modal.in {
display: flex !important;
align-items: center;
}
참고: 가장 간단한 솔루션이지만 브라우저 지원으로 인해 모든 사용자에게 적합하지 않을 수 있습니다. http://caniuse.com/ #flex=flexbox
IE가 (평소처럼) 뒤처진 것 같아요.저의 경우, 제가 직접 또는 고객을 위해 개발하는 모든 제품은 IE10+입니다. (실제 제품을 개발하고 MVP를 더 빨리 얻는 데 사용할 수 있는데 이전 버전의 IE를 지원하는 개발 시간을 투자하는 것은 비즈니스적으로 현명하지 않습니다.)이것은 확실히 모든 사람들이 가지고 있는 사치는 아닙니다.
더 큰 사이트에서 Flexbox가 지원되는지 여부를 감지하고 페이지 본문에 클래스를 적용하는 것을 보았습니다. 하지만 프런트 엔드 엔지니어링 수준은 매우 강력하며, 여전히 폴백이 필요합니다.
저는 사람들이 웹의 미래를 받아들이도록 권장하고 싶습니다.Flexbox는 훌륭하며 가능하면 사용을 시작해야 합니다.
추신 - 이 사이트는 플렉스박스를 전체적으로 파악하여 모든 사용 사례에 적용하는 데 도움이 되었습니다. http://flexboxfroggy.com/
편집: 한 페이지에 두 개의 모델이 있는 경우 이는 .modal.in 에 적용됩니다.
장점:
- 장치보다 높이가 큰 경우에도 액세스할 수 있는 모달 콘텐츠
- 사하지않을
display:table-cell.) (레이아웃용입니다.) - 3 .
markup - 포지셔닝은 순수 CSS입니다.JS는 클릭/탭 시 모달을 닫기 위해 아래와 위에 추가됩니다.
- 가 없는 ▁the▁un를 했습니다.
SCSS을 사용하는 사람들을 위한gulp또는grunt
// closes the modal on click/tap below/above the modal
$('.modal-dialog').on('click tap', function(e){
if (e.target.classList.contains('modal-dialog')) {
$('.modal').modal('hide');
}
}).modal-dialog {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-moz-box-orient: vertical;
-moz-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
overflow-y: auto;
min-height: -webkit-calc(100vh - 60px);
min-height: -moz-calc(100vh - 60px);
min-height: calc(100vh - 60px);
}
@media (max-width: 767px) {
.modal-dialog {
min-height: -webkit-calc(100vh - 20px);
min-height: -moz-calc(100vh - 20px);
min-height: calc(100vh - 20px);
}
}<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>참고: 저는 부트스트랩 3의 최신 사양으로 이 답변을 최신 상태로 유지할 예정입니다.Bootstrap 4 솔루션의 경우 다음 답변을 참조하십시오(현재는 거의 동일하지만 시간이 지나면 서로 다를 수 있음).버그나 문제가 발견되면 알려주시면 업데이트하겠습니다.감사해요.
가 없는 로고침, 접사없음두SCSS)로 )gulp/grunt):
.modal-dialog {
display: flex;
flex-direction: column;
justify-content: center;
overflow-y: auto;
min-height: calc(100vh - 60px);
@media (max-width: 767px) {
min-height: calc(100vh - 20px);
}
}
또 다른 CSS 솔루션.보기 포트보다 큰 팝업에서는 작동하지 않습니다.
.modal-dialog {
position: absolute;
right: 0;
left: 0;
margin-top: 0;
margin-bottom: 0;
}
.modal.fade .modal-dialog {
transition: top 0.4s ease-out;
transform: translate(0, -50%);
top: 0;
}
.modal.in .modal-dialog {
transform: translate(0, -50%);
top: 50%;
}
.modal-dialog으로 하는 (상대인적위절인대고재중내하클로스래는으심을용하의정치로적▁overr▁class클스.right:0, left: 0
.modal.fade .modal-dialog , .modal.in .modal-dialogtop번역보다는.
margin-top팝업이 작은 경우 팝업을 중앙 아래로 약간 이동하고 팝업이 긴 경우 모달이 헤더로 고정됩니다.이런 이유로margin-top:0, margin-bottom:0
좀 더 다듬어야 합니다.
Angular-ui 부트스트랩을 사용하는 사람들은 위의 정보를 기반으로 아래의 클래스를 추가할 수 있습니다.
참고: 다른 변경은 필요하지 않으며 모든 모델이 해결됩니다.
// The 3 below classes have been placed to make the modal vertically centered
.modal-open .modal{
display:table !important;
height: 100%;
width: 100%;
pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}
.modal-dialog{
display: table-cell;
vertical-align: middle;
pointer-events: none;
}
.modal-content {
/* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
width:inherit;
height:inherit;
/* To center horizontally */
margin: 0 auto;
pointer-events: all;
}
Javascript를 사용할 필요가 없습니다.부스트랩 모달이 나타날 때 클래스에 .를 추가합니다.플렉스 CSS가 있는 modalclassName.fade.in 과 함께 이 클래스 조합을 수정하면 완료됩니다.
이 CSS를 추가하여 모달을 수직과 수평으로 중앙에 배치합니다.
.modal.fade.in {
display: flex !important;
justify-content: center;
align-items: center;
}
.modal.fade.in .modal-dialog {
width: 100%;
}
.modal.in .modal-dialog {
position: relative;
top: 50%;
transform: translateY(-50%);
}수직 중심 .modal-dialog-centered를 .modal-dialog에 추가하여 모달의 수직 중심을 맞춥니다.
데모 모드 시작
<!-- Modal -->
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalCenterTitle">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
내 선택, 단지 작은 CSS: (IE8에서 작동하지 않음)
.modal.fade .modal-dialog {
transform: translate(-50%, -80%);
}
.modal.in .modal-dialog {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
margin-top: 0px;
}
첫 번째 규칙을 사용하여 모달이 나타나는 방식을 변경할 수 있습니다.
사용: 부트스트랩 3.3.4
기존 CSS에 다음 CSS를 추가하면 됩니다.
.modal {
text-align: center;
}
@media screen and (min-width: 768px) {
.modal:before {
display: inline-block;
vertical-align: middle;
content: " ";
height: 100%;
}
}
.modal-dialog {
display: inline-block;
text-align: left;
vertical-align: middle;
}
Arany님의 답변을 기반으로 하지만 페이지 스크롤에 대한 회계처리도 합니다.
(function($) {
"use strict";
function positionModals(e) {
var $this = $(this).css('display', 'block'),
$window = $(window),
$dialog = $this.find('.modal-dialog'),
offset = ($window.height() - $window.scrollTop() - $dialog.height()) / 2,
marginBottom = parseInt($dialog.css('margin-bottom'), 10);
$dialog.css('margin-top', offset < marginBottom ? marginBottom : offset);
}
$(document).on('show.bs.modal', '.modal', positionModals);
$(window).on('resize', function(e) {
$('.modal:visible').each(positionModals);
});
}(jQuery));
저는 이것이 렌스 드 노벨의 솔루션보다 조금 더 깨끗한 순수 CSS 솔루션이라고 생각합니다.또한 대화 상자 외부를 클릭하여 대화 상자를 닫는 것을 방지하지 않습니다.
http://plnkr.co/edit/JCGVZQ?p=preview
.modal-dialog 클래스가 있는 DIV 컨테이너에 CSS 클래스를 추가하면 부트스트랩 CSS보다 더 높은 특수성을 얻을 수 있습니다.
HTML
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
<div class="modal-dialog centered modal-lg">
<div class="modal-content">
...
</div>
</div>
</div>
그리고 이 .modal-dialog.center 컨테이너를 고정하고 적절하게 배치합니다.
CSS
.modal .modal-dialog.centered {
position: fixed;
bottom: 50%;
right: 50%;
transform: translate(50%, 50%);
}
또는 Flexbox를 사용하면 훨씬 더 간단합니다.
CSS
.modal {
display: flex;
align-items: center;
justify-content: center;
}
이는 BS3에서 작동하며 v2에서 테스트되지 않습니다.모달의 중심을 수직으로 맞춥니다.위치에 표시하려면 CSS를 편집하십시오.transition을 위한 재산..modal-dialog
centerModal = function() {
var $dialog = $(this).find(".modal-dialog"),
offset = ($(window).height() - $dialog.height()) / 2;
// Center modal vertically in window
$dialog.css({
'transform': 'translateY(' + offset + 'px) !important',
});
};
$('.modal').on('shown.bs.modal', centerModal);
$(window).on("resize", function() {
$('.modal').each(centerModal);
});
e(document).on('show.bs.modal', function () {
if($winWidth < $(window).width()){
$('body.modal-open,.navbar-fixed-top,.navbar-fixed-bottom').css('marginRight',$(window).width()-$winWidth)
}
});
e(document).on('hidden.bs.modal', function () {
$('body,.navbar-fixed-top,.navbar-fixed-bottom').css('marginRight',0)
});
이것은 Arany의 대답을 받아들여 모달이 화면 높이보다 클 경우 작동하게 합니다.
function centerModal() {
$(this).css('display', 'block');
var $dialog = $(this).find(".modal-dialog");
var offset = ($(window).height() - $dialog.height()) / 2;
//Make sure you don't hide the top part of the modal w/ a negative margin if it's longer than the screen height, and keep the margin equal to the bottom margin of the modal
var bottomMargin = $dialog.css('marginBottom');
bottomMargin = parseInt(bottomMargin);
if(offset < bottomMargin) offset = bottomMargin;
$dialog.css("margin-top", offset);
}
$('.modal').on('show.bs.modal', centerModal);
$(window).on("resize", function () {
$('.modal:visible').each(centerModal);
});
bootstrap modal.js에 수직 모달 센터링을 추가하기 위해 이것을 마지막에 추가했습니다.Modal.prototype.show함수:
var $modalDialog = $('.modal-dialog'),
modalHeight = $modalDialog.height(),
browserHeight = window.innerHeight;
$modalDialog.css({'margin-top' : modalHeight >= browserHeight ? 0 : (browserHeight - modalHeight)/2});
Modal 수직 정렬 대화상자를 만듭니다.
참고:
1.선택기를 할당할 필요가 없더라도 문서에서 모든 모달을 찾아 수직으로 가운데로 만듭니다.
2.특정 모달이 중심이 되는 중간을 피하려면 사용할 수 있습니다. 클릭 이벤트에서 선택할 수 없습니다.
*/
$( "[data-toggle='modal']" ).click(function(){
var d_tar = $(this).attr('data-target');
$(d_tar).show();
var modal_he = $(d_tar).find('.modal-dialog .modal-content').height();
var win_height = $(window).height();
var marr = win_height - modal_he;
$('.modal-dialog').css('margin-top',marr/2);
});
밀라노 판디아에서
모델을 중앙에 배치하는 이 간단한 스크립트를 사용합니다.
원하는 경우 사용자 지정 클래스(예: .modal 대신 .modal.modal-vcenter)를 설정하여 기능을 일부 모델로만 제한할 수 있습니다.
var modalVerticalCenterClass = ".modal";
function centerModals($element) {
var $modals;
if ($element.length) {
$modals = $element;
} else {
$modals = $(modalVerticalCenterClass + ':visible');
}
$modals.each( function(i) {
var $clone = $(this).clone().css('display', 'block').appendTo('body');
var top = Math.round(($clone.height() - $clone.find('.modal-content').height()) / 2);
top = top > 0 ? top : 0;
$clone.remove();
$(this).find('.modal-content').css("margin-top", top);
});
}
$(modalVerticalCenterClass).on('show.bs.modal', function(e) {
centerModals($(this));
});
$(window).on('resize', centerModals);
또한 모달의 수평 간격에 대해 이 CSS 수정을 추가합니다. 우리는 모달에 스크롤을 표시하고, 본문 스크롤은 부트스트랩에 의해 자동으로 숨겨집니다.
/* scroll fixes */
.modal-open .modal {
padding-left: 0px !important;
padding-right: 0px !important;
overflow-y: scroll;
}
이 질문에 대한 또 다른 CSS 답변은...
이 솔루션은 CSS를 사용하여 원하는 효과를 달성하는 동시에 외부를 클릭하여 모달을 닫는 기능을 유지합니다.또한 설정할 수 있습니다..modal-content팝업이 뷰포트 밖으로 확대되지 않도록 높이 및 너비 최대값을 지정합니다.내용이 모달 크기를 초과하면 스크롤이 자동으로 나타납니다.
참고:
부트스트랩 권장 사항.modal-dialog div이 작업이 제대로 작동하려면 생략해야 합니다(아무것도 손상되지 않은 것 같습니다).Chrome 51 및 IE 11에서 테스트되었습니다.
CSS 코
.modal {
height: 100%;
width: 100%;
}
.modal-content {
margin: 0 auto;
max-height: 600px;
max-width: 50%;
overflow: auto;
transform: translateY(-50%);
}
편집: 더.modal-dialog클래스를 사용하면 사용자가 모달 자체 외부를 클릭하여 모달을 닫을 수 있는지 여부를 선택할 수 있습니다.대부분의 모델에는 명시적인 '닫기' 또는 '취소' 버튼이 있습니다.이 해결 방법을 사용할 때는 이 점에 유의하십시오.
너비와 높이로 모달을 중앙 집중화하는 가장 좋은 솔루션은 CSS 추가와 모달 추가로 이 '중앙 집중화'를 클래스로 추가하는 것입니다.
.centralize{
position:absolute;
left:50%;
top:50%;
background-color:#fff;
transform: translate(-50%, -50%);
width: 40%; //specify watever u want
height: 50%;
}
언급URL : https://stackoverflow.com/questions/18053408/vertically-centering-bootstrap-modal-window
'programing' 카테고리의 다른 글
| 오라클 SQL Developer를 사용하여 텍스트 파일로 CLOB 내보내기 (0) | 2023.09.02 |
|---|---|
| SQL - 각 레코드에 대한 Call Stored Procedure (0) | 2023.09.02 |
| "그 요청은 크기 때문에 거절되었습니다." 스프링, 톰캣 (0) | 2023.09.02 |
| 마리아와 함께 암호를 쓰는 사람DB (0) | 2023.09.02 |
| 오류입니다. ORA-12154: TNS: 지정된 연결 식별자를 확인할 수 없습니까? (0) | 2023.09.02 |