Jodit 에디터 게시판 글쓰기 (3) - 동영상
페이지 정보
작성자 운영자 작성일 25-04-30 20:23 조회 4 댓글 4본문
Jodit 에디터 게시판 글쓰기 (3) - 동영상
댓글목록 4
운영자님의 댓글
운영자 작성일
<p>
<div class="yt-basic" style="display:block; width:100%; aspect-ratio:16/9;">
<iframe src="https://www.youtube.com/embed/sLpU1Dh_TY4" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
</div>
<br></p><style>
/* 에디터 내 이미지 반응형 */
img {
max-width: 100%;
height: auto;
}
/* 유튜브 컨테이너 반응형 */
.youtube-bo_v_con {
position: relative;
width: 100%;
padding-bottom: 56.25%;
margin: 1em 0;
overflow: hidden;
}
.youtube-bo_v_con iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
border: none;
}
/* 유튜브 쇼츠 */
.youtube-bo_v_con.youtube-shorts {
padding-bottom: 177.78%;
max-width: 315px;
margin: 1em auto;
}
/* 비디오 반응형 */
video {
max-width: 100%;
height: auto;
}
/* 오디오 반응형 */
audio {
width: 100%;
max-width: 100%;
}
</style>
운영자님의 댓글
운영자 작성일<p>이모지 테스트...
운영자님의 댓글
운영자 작성일<p>Jodit 에디터 이모지 입력 안됨....ㅠㅡㅠ</p>
운영자님의 댓글
운영자 작성일<p><img src="https://www.moa.pe.kr/g5/data/editor/2504//1746022289.4108zHKdXdPHIsch2.gif" alt="이미지"></p><style>
/* 에디터 내 이미지 반응형 */
img {
max-width: 100%;
height: auto;
}
/* 유튜브 컨테이너 반응형 */
.youtube-bo_v_con {
position: relative;
width: 100%;
padding-bottom: 56.25%;
margin: 1em 0;
overflow: hidden;
}
.youtube-bo_v_con iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
border: none;
}
/* 유튜브 쇼츠 */
.youtube-bo_v_con.youtube-shorts {
padding-bottom: 177.78%;
max-width: 315px;
margin: 1em auto;
}
/* 비디오 반응형 */
video {
max-width: 100%;
height: auto;
}
/* 오디오 반응형 */
audio {
width: 100%;
max-width: 100%;
}
</style>