반응형
홈페이지를 제작할 때나 포스팅을 할 때 반응형으로 제작되어 있지 않은 지도나 유튜브,비메오등의 동영상 플레이어들은 아이프레임화로 사이즈가 고정되어 있어 크기를 줄이거나 늘릴때 이미지나 동영상이 잘려 나옵니다.
이에 대응 할 수 있는 방법은 크기를 %로 바꿔 css표기하는 방법인데, 지도의 경우는 클래스를 지정해 홈페이지에서 따로 표기를 하는 번거로움 등을 예로 들 수 있고, 적용도 힘들다는 단점이 있습니다.
이를 보완해줄 수 있는 방법이 바로 아래에 표기된 사이트입니다. 사용방법은 아주 간단합니다. 유튜브나 비메오등의 사이트 주소를 그대로 복사해 해당 사이트에서 임베드 시키면 소스코드가 하단에 나오게되는데 그 소스코드를 긁어 복사해 적용하고 싶은곳에 바로 적용하시면됩니다. 프론트작업이 어려운 분들이거나 바로 반응형 유튜브를 사용하고 싶은분들은 아래 사이트를 이용 해 보세요 :-)
embedresponsively.com
NOTE: You may want to remove any hard coded values you see below with regards to "width" and "height" in the below code. These values may be in the iFrame SRC parameters, or in the iFrame query string. Experiment to see what works best. Great news! The emb
embedresponsively.com
반응형
'Design > 퍼블리싱 지식창고' 카테고리의 다른 글
| 디자이너의 작업 화면을 공유하는 협업 툴 제플린 (0) | 2023.05.19 |
|---|---|
| 웹퍼블리싱 강의 및 홈페이지 제작 유틸 모음 (2) | 2023.04.28 |
| CSS 소개와 사용방법 (CSS란 무엇인가?) (0) | 2023.02.15 |
| 제이쿼리 슬라이더, 캐러셀 유틸 모음 (jQuery, Carasel) (0) | 2023.02.14 |
| 임대형 홈페이지와 무료 홈페이지란? (0) | 2022.12.29 |
