공부/메가박스 사이트 따라만들기
메가박스 사이트 따라 만들기 - Youtube API - 끝
메가박스 사이트 따라 만들기 - Youtube API - 끝
2022.02.13탭메뉴, 스킵메뉴 https://developers.google.com/youtube/player_parameters youtube API 매개변수 설정 사이트 결과 HTML style.css /* 트레일러 */ .overlay { background: rgba(0, 0, 0, .92); display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 10000; } .modal { position: absolute; } .modal_close { background: url(../img/close.svg) no-repeat; background-size: 32px 32px; border: 0; color: trans..
메가박스 사이트 따라 만들기 - 탭 메뉴, SKIP 메뉴
메가박스 사이트 따라 만들기 - 탭 메뉴, SKIP 메뉴
2022.02.13탭메뉴, 스킵메뉴 .siblings() 선택한 요소의 형제 요소를 선택합니다. .parent() 선택한 요소의 부모 요소를 선택합니다. 결과 HTML, js 최신 영화 소식 새로운 이벤트 새로운 영화 style.css /* 스킵 메뉴 */ #skip { position: relative; } #skip a { position: absolute; left: 0; top: -40px; width: 140px; line-height: 30px; border: 1px solid #fff; color: #fff; text-align: center; background: #333; } #skip a:active, #skip a:focus { top: 0; } 출력
메가박스 사이트 따라 만들기 - 푸터영역
메가박스 사이트 따라 만들기 - 푸터영역
2022.02.13푸터 영역 Emmit 기능 ul>li.icon.s$*5>a[#]>span white-space: nowrap; : 두 줄로 만들 때 결과 HTML 트위터 페이스북 인스타그램 구글 플레이 아이폰 앱스토어 ARS 1544-0070 회사소개 채용정보 제휴/광고/부대사업 문의 이용약관 개인정보처리방침 고객센터 윤리경영 서울특별시 강남구 도산대로 156, 2층 메가박스중앙(주) (논현동, 중앙엠앤비사옥) 대표자명 김진선 개인정보보호 책임자 경영지원실 실장 박영진 사업자등록번호 211-86-59478 통신판매업신고번호 제 833호 Copyright 2014 by MegaboxJoongAng Inc. All right reserved style.css /* 푸터 */ .footer_sns { position: abs..
메가박스 사이트 따라 만들기 - Help 영역 반응형
메가박스 사이트 따라 만들기 - Help 영역 반응형
2022.02.13헬프영역 반응형 헬프 영역을 반응형을 고려하여 css를 부여합니다. 결과 style.css @media (max-width: 1024px) { .help article.help_box1 { width: 49%; margin-right: 2%; } .help article.help_box2 { width: 49%; margin-right: 0; } .help article.help_box3 { width: 100%; margin-top: 2%; } .help article { height: auto; } .service li { width: 25%; height: auto; } .service li:nth-child(1) { border-bottom: 1px solid #d7d7d7; } .service ..
메가박스 사이트 따라 만들기 - 고객센터 / SVG
메가박스 사이트 따라 만들기 - 고객센터 / SVG
2022.02.13고객센터/SVG SVG 아이콘은 SVG로 이용할 경우 선명도가 뛰어나고, 반응형이 지원됩니다. 최근 많이 사용하는 추세이며, 단점은 익스플로러 옛날 버전에서는 지원이 안됩니다. 결과 HTML 고객센터 1:1 문의 단체관람 자주묻는 질문 분실물 문의 style.css /* 고객센터 */ .service ul { overflow: hidden; } .service li { float: left; width: 50%; height: 193px; box-sizing: border-box; border: 1px solid #d7d7d7; text-align: center; } .service li a span { display: block; width: 120px; height: 120px; margin: 20p..
메가박스 사이트 따라 만들기 - 메가박스 할인카드
메가박스 사이트 따라 만들기 - 메가박스 할인카드
2022.02.13메가박스 할인카드 min-height 영역이 없을 경우 min-height값을 줘서 영역을 잡아줍니다. 결과 HTML 메가박스 할인카드 T멤버십 일반 영화 2,000원 현장 즉시 할인(1일 5매) T멤버십 일반 영화 2,000원 현장 즉시 할인(1일 5매) T멤버십 일반 영화 2,000원 현장 즉시 할인(1일 5매) style.css /* 할인카드 */ .card { padding: 17px; } .card ul {} .card ul li { position: relative; border: 1px solid #d7d7d7; padding: 17px; margin-bottom: 17px; min-height: 102px; box-sizing: border-box; } .card ul li span { p..
메가박스 사이트 따라 만들기 - 공지사항
메가박스 사이트 따라 만들기 - 공지사항
2022.02.13공지사항 한 줄 효과 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 결과 HTML 공지사항 전체 공지 전체 2019.05.26 [무대인사] 터미네이터6 시즌 발표 및 영상 제작 10주년 기념 라이브 쇼 전체 2019.05.27 [무대인사] 터미네이터6 시즌 발표 및 영상 제작 10주년 기념 라이브 쇼 전체 2019.05.27 [무대인사] 터미네이터6 시즌 발표 및 영상 제작 10주년 기념 라이브 쇼 전체 2019.05.28 [무대인사] 터미네이터6 시즌 발표 및 영상 제작 10주년 기념 라이브 쇼 영화관 공지 안양 2019.05.26 [영화인사] 터미네이터6 시즌 발표 및 영상 제작 10주년 기념 라이브 쇼 인덕원 2019.05.27 [..
메가박스 사이트 따라 만들기 - 새로운 영화 영역 2
메가박스 사이트 따라 만들기 - 새로운 영화 영역 2
2022.02.13새로운 영화 영역 2 box-sizing: border-box; 조건 : width값이 50px / 마진 20px / 패딩 10px / 보더 1px 결과 : 총 width값 : 90px(패딩, 보더값 불포함) 결과 HTML 새로운 영화 로그 원: 스타워즈 스토리 2016년 10월 28일 개봉 7.5/10 액션미국, 오스트레일리아 142분12세 이상 관람가 단숨에 행성 하나를 파괴할 위력을 지닌 데스 스타가 완성되기 전에 설계도를 훔쳐내야 하는 이번 작전의 성공 확률은 고작 2.4%. 생사도 모르는 아버지에 얽힌 비밀을 밝히려는 진을 ...비롯해 유능한 정보 요원 ‘카시안’(디에고 루나), 두 눈이 멀었지만 탁월한 무술 실력을 지닌 ‘치루트’(견자단), 전투 베테랑 ‘베이즈’, 파일럿 ‘보디’, 시니컬한 ..