실전! 웹사이트 제작! Step by Step! (와이스튜디오_반응형웹)

실전! 웹사이트 제작! Step by Step! (와이스튜디오_반응형웹)

(7개의 수강평)

70명의 수강생
HTML/CSS웹 디자인웹 퍼블리싱인터랙티브 웹
48,400원
지식공유자 · J.영
31회 수업· 총 5시간 17분수업
평생 무제한 시청
수료증 발급 강의
수강 난이도 초급
jianee12 프로필

레이아웃 질문 jianee12 11일 전
레이아웃 강의를 마쳤는데 창 너비를 줄였을 경우 저렇게 width:100%에 맞춰 이미지가 작아지고 header의 로고와 welcome이 위 아래로 정렬 됩니다. 어떻게 해야하나요?? @charset "utf-8"; @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap"); /*reset*/ *{margin:0; padding:0;} html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, thread, tr, td, th,{margin:0; padding:0;} h1, h2, h3, h4, h5, h6{font-size:inherit;} a{text-decoration:inherit; color:inherit;} /*layout*/ body{font-family: 'Roboto', sans-serif; font-size:15px;} .wrap{width:100%; margin:0 auto;} /*header*/ header{width:100%; padding-top:20px; /*background:yellow;*/ position:fixed; z-index:100;} .innerHeader{height:80px; padding:0 80px; /*background: blue;*/ } .innerHeader .logo{width:170px; height:60px; float:left; /*background: red;*/ margin-right:180px;} .innerHeader .logo a{display:block; width:100%; height:100%; /*background: green;*/} .innerHeader .logo a img{width:100%;} .innerHeader .logo a img:nth-child(2){opacity:0;} .innerHeader .introTxt{float:left; text-transform:uppercase; color:#fff; line-height:70px;} .innerHeader .menuOpen{float: right; display:block; color:#fff; font-size:16px; margin-top:25px; font-weight:bold;} .innerHeader .menuOpen span{margin-left:15px; font-size:33px; display:inline-block; vertical-align: middle; margin-top:-6px;} /*visual*/ .visual{} .visual .slide li{width:100%; height:100vh; position:relative;} .visual .slide li img{position:absolute; right:0; bottom:0; width:100%;} .visual .slide li .txt{position:absolute; left: 10%; top:50%; color:#fff; font-size:18px; transform:translateY(-50%);} .visual .slide li .txt h3{font-size:64px; margin:30px 0; } .visual .slide li .txt a{display:inline-block;} .visual .slide li .txt a span{font-size: 14px; margin-left:5px;} .visual .slide li .scroll{position:absolute; left:50px; bottom:10%; transform:rotate(-90deg); color:#ccc; font-weight:bold;}

1
onlyblue01 프로필

제이쿼리 파일이 어디에 있는건가요? onlyblue01 27일 전
제이쿼리 부분 강의 시작하려고 하는데 어디에 제이쿼리 파일을 올려 주신건가요? 다운받으려고 하는데 어디서 찾아야할지 모르겠어요..ㅠ

1
석경민 프로필

제이쿼리 이벤트 png 파일은 어디 있는 건가요? 석경민 1달 전
제이쿼리 이벤트 png 파일을 찾을려는 데 어디서 다운받을 수 있는 건지 알려주세요

5
_한예리 프로필

현업관련 질문 _한예리 1달 전
현업에서 자바스크립트를 지양할 경우에는 어떤 스크립트들로 대체해서 사용할 수 있나요? 

1
태훈 프로필

자료를 다운하는데 압축 풀려고 하는데 안되네요 태훈 2달 전
고쳐주세요 ㅎㅎ mp1918@naver.com 으로 보내주세요

6
junguk1403 프로필

다음강의 내용과 나오는 시간 junguk1403 2달 전
선생님 강의들 다 봤는데 다음 강의도 보고싶어서 정확히 언제쯤 나오는지 알고싶고 요새 flex를 사용많이한다는데 다음강의에 이 내용이 포함되나여?

1
kate 프로필

자료에 코딩파일 첨부 부탁드려요. kate 4달 전
자료에 코딩파일 첨부 부탁드려요.

1
지영 프로필

제공해주시는 이미지들이 강의와 다릅니다..! 지영 4달 전
제공해주시는 이미지들이 강의와 다릅니다..! 혹시 깃이나 코드 확인 할 수 있는 곳이 있을까요?

1
지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의들을
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스