본문 바로가기

넷플릭스 만들기3

11 탭 클릭시 해당 문구, 버튼, 사진 보이게 하기 결과 미리보기 1 예시로 적어둔 기본 문구를 삭제하고 2 section에 클래스 추가 하기 3 위 column에 내용 넣기 (중간 결과물) 4 아래 columns 에 내용 넣기 Watch on your TV Smart TVs, PlayStation, Xbox, Chromecast, Apple TV, Blue-ray Watch instantly or download for later Available on phone and tablet, wherever you go. Use any computer Watch right on Netflix.com. (중간 결과물) 5 위 culumn에 있는 글자, 패딩, 마진 사이즈 조절하기 watchanywhere 섹션 h2글자 효과 주기 6 위 column과 아래 col.. 2021. 6. 8.
9 섹션 탭 클릭시 빨간줄 보이고, 해당 탭 아래 내용 나오게하기 목표 메인 페이지 아래 3가지 섹션탭을 가로 정렬로 만들고 각 탭을 클릭하면 해당 내용이 뜨게 하기. 결과 미리보기 1 자바 스크립트 폴더와 파일 만들기 아이콘 클릭시 뭔가 뜰려면 자바 스크립트에서 해야한다. Netflix Clone 오른쪽 버튼 눌러서 새폴더 만들고 나서 다시 오른쪽 버튼 눌러서 새 파일 만든다. 이름을 app.js로 한다. 2 html에서 js 스크립트 입력 jquery 많이 쓰는 라이브러리 연결 app.js 스크립트 입력, app.js 폴더와 연결 3 js에 내용 입력 $(function() { var tabs = $('#features > nav a'); var tabsContent = $('#features > nav > article > section'); tabs.click(.. 2021. 6. 6.
2 CSS 기본 셋팅 1 css 폴더를 만든다 Netflix Clone 오른쪽 클릭해서 새 폴더를 누르고 css 적는다. 2 style.css 파일을 만든다 css 폴더 오른쪽 클릭해서 style.css 파일을 만든다. 3 html 파일과 css 파일을 연결한다 href에는 파일 위치를 적어준다 4 css로 간단한 효과를 넣어본다 body에 있는 글자 See what's next.를 왼쪽으로 바짝 붙여보자. (결과 보기) ⬇️ S 옆의 빈 공간이 없어졌다. 5 See what's next를 header 안으로 넣는다. 2021. 6. 4.

티스토리툴바