HTML2 HTML, CSS 무한 롤링, 흐르는 텍스트 마우스 오버시 텍슽 색상이 변하면서 일시 정지됩니다. CSS 스타일 .marquee-text { display: flex; flex: 0 0 auto; white-space: nowrap; overflow: hidden; transition: 0.3s; font-size: 2rem; font-weight:300; color: #000000; } .marquee-text:hover { color: #999999; } .marquee-text:hover .marquee-wrap { animation-play-state: paused; cursor: pointer; } .marquee-wrap { animation: textLoop 10s linear infinite; padding-right: 1.4881v.. 2024. 2. 6. 2024년, 웹사이트에 반응형 유튜브 비디오 추가하기 유튜브 영상을 웹사이트에 넣기위한 방법은 여러해 동안 다양한 방법이 동원되었습니다. 하지만 이제 아래 코드만으로 반응형 웹페이지까지 한번에 처리 가능합니다. CSS 마크업 .video-container { position: relative; padding-bottom: 56.25%; } .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } 비디오 태그 종횡비 속성 CSS 추가하기 .video { aspect-ratio: 16 / 9; width: 100%; } 마지막으로 iframe에 클래스(.video) 를 적용합니다. .video 클래스명은 원하대로 수정가능합니다. 이상 반응형 웹사이트까지 .. 2024. 2. 5. 이전 1 다음
