반응 형 웹 디자인 - 비디오 : width, max-width 속성 사용

수다왕

프로필 보기 이 회원 글보기 이 회원의 댓글보기

· 8년 전 · 조회 2860 2860

반응 형 웹 디자인 - 비디오

width 속성 사용
경우 width속성을 100 %로 설정, 비디오 플레이어가 반응하고 위 아래로 확장 할 수 :

예
video {
width: 100%;
height: auto;
}

위의 예에서 동영상 플레이어는 원래 크기보다 커질 수 있습니다. 대부분의 경우 더 나은 해결책은 max-width대신 속성 을 사용하는 것입니다.

max-width 속성 사용
경우 max-width속성을 100 %로 설정, 비디오 플레이어는에있는 경우 축소,하지만 원래 크기보다 크게 확장하지 않습니다 :

예
video {
max-width: 100%;
height: auto;
}

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시판 목록

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.

글쓰기

번호	분류	제목	글쓴이	날짜	조회
767		신입 개발 ->디자인 ->퍼블로 왔습니다! [4]	웹표준3년차 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	3976
766		jQuery Tree 를 만들었습니다.~~ [2]	kiplayer 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	2894
765		퍼블리셔 수습기간인데 질문드립니다. [12]	DavidCorleone 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	4023
764	기타	swip 사용 안하고, touchstart, touchmove 사용하여 슬라이드 구현 [1]	돼지코구뇽 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	4704
763	기타	많이들 사용하시는 Slider 에 대해서... [3]	kiplayer 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	9558
762	기타	텝메뉴 상단고정 및 해당위치 스크롤 [5]	표블리셔 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	9115
761	기타	유튜브 재생 중인 팝업 레이어 숨길 때 재생 멈추는 방법 [2]	지운아빠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	8801
760	반응형	반응형 코딩할때 height:100% 에 관해서... [3]	ABC디자인 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	12968
759	기타	ie 와 크롬 폰트 부분해결할 수 있는건지좀 알려주시면 감사드립니다. [1]	바른통남 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	4002
758	CSS	당신은 모를 수도 있는 CSS의 7가지 단위 [4]	JRevirthuum 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6015
757	HTML	모바일 작업시 숫자인식,메일주소, 지도상의 주소링크 막기	임예니 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	3943
756	기타	구글의 material design에 관한 설명입니다. [4]	JRevirthuum 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	4822
755	CSS	css가 충돌이 됬을때 [4]	돼지코구뇽 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	15881
754	HTML	HTML Canvas 2D Context	RINIX 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6142
753	HTML	HTML5 자바스크립트 API [1]	RINIX 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	4901
752	기타	ShadowDOM Visualizer	JRevirthuum 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6088
751	반응형	각 해상도별 테스트. [8]	LaRuota 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	7243
750	HTML	결제모듈과 구글웹사이트 번역 엘리먼트	박쥐12 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	7962
749	HTML	팁] 모바일에서 문자보내기 [2]	카츠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	7427
748	반응형	짧고 굵은거 [1]	옵션 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6735
747	반응형	반응형 가변(가로, 세로) 아이프레임 제이쿼리 플러그인 [13]	묵공 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	12355
746	기타	계륵.. css3, jquery 를 이용한 랜덤 돌림판 포인트게임	뽁스 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	13538
745	CSS	익스8이하에서 css3을 사용하기 [3]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6458
744	CSS	레이어팝업 가로 중앙 위치 시키기 [3]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	12362
743	기타	ie8에 font awesome 적용 방법 [6]	지운아빠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	7919
742	HTML	팁]모바일에서 전화 걸기 [1]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6588
741	기타	파비콘 넣는 방법이에요. [1]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6947
740	CSS	css !important 의 활용 [3]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6417
739	CSS	sprite 이미지를 css코드로 변환해주는 웹도구 [3]	우산11 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	5748
738	기타	영역 스크롤 질문드립니다. [1]	별이님 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	3631