61,600원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
이미지와 텍스트 준비
■ 질문 남기실 때 꼭! 참고해주세요.- 먼저 유사한 질문이 있었는지 검색해주세요.- 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다.- HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요.- 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다. 안녕하세요. 선생님이 만드신 웹사이트를 각색해서 제 포트폴리오 중 하나로 만드려고 하는데 이미지와 텍스트 준비에 대해 질문드립니다. 별 것 아닌 질문일 수도 있겠지만 저한텐 어려운 부분이고 잘 몰라서 배워야 할 것들이 많아 답변을 기다리겠습니다. 도움이 필요합니다.! - 핸드폰 프레임 안에 이미지를 넣을 경우, 제가 포토샵으로 직접 만드는 건가요? 아니면 무료 이미지 사이트에서 찾아 넣으면 될까요? 다른 포트폴리오 영상에서 보여지는 백그라운드 이미지도요.. 다른 분들께선 포트폴리오 만드실 때 직접 제작을 한건지 찾아넣은건지 ㅠㅠ - 주제에 맞는 텍스트를 구하는 게 생각보다 시간도 걸리고 읽히는 내용이라 대충 넣기도 그런데.. lorem ipsum으로만 채우면 성의가 없어 보이고, 생각보다 부담이 됩니다. 그렇지만 감수를 해야하니 덜 어려운 팁이랄 게 있을까요? 어디서 인용을 해와야 잘 만들 수 있을까요.. 한글입숨도 이용은 해봤습니다. 영어와 한글 텍스트 비중에 상관이 없는 게 맞을까요?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
스크롤하면 시작되는 애니메이션 wow.js
■ 질문 남기실 때 꼭! 참고해주세요. 스크롤하면 시작되는 애니메이션 wow .js 궁금한게 있는데요 처음에는 애니메이션이되는데 양옆으로 갔다가 오는게 되는데 다시 위로 올리면 애니메이션이 실행이안되요(양옆으로 갔다가 다시 제자리로 오는 애니메이션) 새로고침해서 처음에만 되는데 원래 그런건가요 ?? 실행이 되고 다시 위로 올려서 내리면 실행이 안되는건가요 ? - 먼저 유사한 질문이 있었는지 검색해주세요.- 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다.- HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요.- 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다.
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
아이패드프로 세로양식 에러
■ 질문 남기실 안녕하세요. 상기의 사진처럼 아이패드프로 세로양식에서 일부구간의 반응형양식에 에러가 있습니다. ^^; 이리저리 해봐도 해결을 못 찾겠습니다. 시간되실때 검토 부탁드립니다.
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
타이핑을 반복해서 실행할 수 있나요?
typing 플러그인에서 글자를 한번 타이핑을 수행하고, 다시 반복해서 지속적으로 타이핑 에니메이션이 수행되었으면 합니다. 방법이 있는지요?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
화면겹침 현상
<!-- Section : welcome --> <section class="welcome"> <div class="slideshow"> <img src="images/slide-welcome-01.png"> <img src="images/slide-welcome-02.png"> <img src="images/slide-welcome-03.png"> </div> <div class="welcome-heading"> <span>창의적인 아이디어를 만드는 가장 빠른 방법</span> <h1> An idea solution of startup for your <em id="typing"></em></em> </h1> <p> 스타트업 메이트 앱이 여러분의 최상의 스타트업 구축을 위해 창의적인 아이디어를 제공하는 데 최선을 다하겠습니다. </p> <div class="welcome-btns"> <a href="#none" class="btn start">CEO 시작하기</a> <a href="#none" class="btn guide">사용자 가이드</a> </div> </div> </section> <!-- Section : ceo-access --> <section class="ceo-access"> <div class="ceo-inner"> <div class="ceo-content"> <div class="ceo-left"> <img src="images/quotation-mark.svg"> <h3>3 Pre-made Solutions for your Startup Business</h3> <p> 창의적인 아이디어를 가장 빠르게 창출할 수 있는 최고의 앱 솔루션을 제공합니다. 여러분의 스타트업을 더욱 성장시키기 위해 온 힘을 다할 것이며, STARTUP MATE는 항상 동반자가 되겠습니다. 감사합니다. </p> <span>앤드류 - 스타트업 메이트 대표이사</span> </div> <div class="ceo-right"> <div class="ceo-msg"> <h3>Application Downloads <span>30,000+</span> </h3> <p> 스타트업메이트는 앱 다운로드 30,000명 이상의 앱 사용자의 충분한 피드백을 통해 검증된 서비스를 제공합니다. </p> </div> <div class="ceo-photo"> <img src="images/icon-face-ceo.jpg"> </div> </div> </div> </div> <div class="access-inner"> <div class="access-content"> <div class="access-left"> <h2>언제나 어디서나 즐겁고 편리한 액세스 스타트업 CEO들의 커뮤니티</h2> <p> 언제나 어디서나, 즐겁고 편리한 액세스가 가능합니다. 회원 가입은 쉽고 간단합니다. 무료 회원 가입 후 로그인하시면 업데이트 된 스타트업 메이트의 서비스를 받으실 수 있습니다. </p> <div class="btn-download"> <a href="#none"> <img src="images/btn-appstore.png"> </a> <a href="#none"> <img src="images/btn-playstore.png"> </a> </div> </div> <div class="access-right"> <img src="images/access-mockup.png"> </div> </div> </div> </section> /* ################### Section : welcome ################### */ .welcome { height: 90vh; position: relative; } /* .slideshow {} */ .welcome-heading { position: absolute; top: 50%; transform: translateY(-50%); left: 200px; text-align: center; width: 750px; } .welcome-heading span { font-size: 24px; } .welcome-heading h1 { font-family: 'Montserrat', sans-serif; font-size: 60px; font-weight: 600; line-height: 1.2em; margin-bottom: 30px; margin-top: 15px; } .welcome-heading h1 em { display: block; font-style: normal; color: rgba(226, 57, 57, 0.959) } .welcome-heading p { padding: 0 100px; margin-bottom: 50px; } .welcome-btns {} .welcome-btns .btn { display: inline-block; width: 160px; padding: 8px; color: #fff; border-radius: 5px; margin: 5px; transition: 0.5s; } .btn.start { background-color: skyblue; } .btn.guide { background-color: #fff; color: #222; } .welcome-btns .btn:hover { box-shadow: 0 5px 10px rgba(0, 0, 0, 0.699); transform: translateY(-3px); } /* ################### Section : ceo-access ################### */ /* .ceo-access {} */ .ceo-inner, .access-inner { display: block; width: 1300px; margin: auto; } .ceo-content { overflow: hidden; border-bottom: 1px solid #eee; padding: 50px 0; } .ceo-content > div { float: left; width: 50%; } .ceo-left { padding-right: 60px; } .ceo-left img { width: 30px; } .ceo-left h3 { font-weight: bold; } .ceo-right { text-align: center; } .ceo-right > div { float: left; padding: 20px; } .ceo-msg { width: 60%; } .ceo-msg h3 { font-size: 28px; color: rgb(31, 146, 102); } .ceo-msg h3 big { display: block; } .ceo-photo { width: 40%; } .ceo-photo img { border-radius: 15px; width: 100%; } .access-content { padding: 50px 0; padding-bottom: 0; overflow: hidden; } .access-content > div { float: left; width: 50%; } .access-left { padding-right: 50px; padding-top: 85px; } .access-right { text-align: center; } .access-right img { display: block; float: right; } .btn-download { margin-top: 30px; } 안녕하세요 선생님, banner강의까지 들은 후 인터넷창을 줄이거나 늘이거나 하면서 장난(?)을 치던 와중, 인터넷 창의 높이가 일정 부분 이하가 되었을 경우 사진과 같이 welcome의 slideshow부분과 ceo-access부분이 겹치게 되면서 ceo-access의 일부가 보이지 않게 된다는 것을 발견하였습니다. 혹시 자연스러운 현상인건지, 아니면 제가 무언가를 실수한것인지, 해결방법이 있을지 궁금하여 질문을 올리게 되었습니다. 글 제주가 부족하여, 위의 현상을 동영상으로도 찍어봤는데... 동영상 업로드 방법을 몰라서 유튜브에 업로드 후 링크 첨부해드립니다. 감사합니다.(https://youtu.be/3lolcNQKMRw) (동영상을 찍으면서 인터넷창의 height를 조절할 때, slideshow의 이미지는 고정이 되어있는데, 그 외는 같이 왔다갔다 하는 이게 문제인 것 같은데,,,, 잘 모르겠습니다 하하 ㅠ)
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
a앵커
■ 질문 남기실 때 꼭! 참고해주세요. 스크립트 부분에 빨간색 으로표시한 부분이 오류라고 떠요 ㅠㅠ 멀잘못적었는 지모르겠어요 scrollTo로 사용해서 부드럽게 하고싶은데 저거 사용하니깐 계속 오류로 뜨고 부드럽게 가지지도 않아요 뭐가 잘못된걸까요 ?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
응용해보다가 막혀서 질문드려보아요
Css 결과물과 웹사이트 제작한 내용들은 포트폴리오에 모달창으로 어떻게 띄워야하는지, 여쭤보아요~
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
feature float부분에서 문제
선생님께서 만드신것과 제가 만든게 달라서 글을 올리게 되었습니다. 1번은 괜찮게 나오는데 2, 3번부터 꼬여서 나오게 되고 있습니다. 혹시 코드 한번 봐주시고 뭐가 문제인지 말씀해주시면 감사하겠습니다. <section class="feature"> <div class="feature_inner"> <div class="headline_share"> <h1>스타트업 CEO 커뮤니티</h1> <p>스타트 업 비즈니스 발전을 위한 다양한 서비스를 제공합니다.</p> </div> <div class="feature_content"> <div class="feature_mockup"> <img src="img/feature-mockup-01.png" alt=""> </div> <div class="feature_about"> <img src="img/icon-num-01.png" alt=""> <h2>스타트업 메이트 CEO 평생 회원 자격</h2> <p> 스타트업 메이트 회원가입은 평생 무료입니다. 조직의 리더 곧, CEO에게 필요한 경영, 전략, 조직관리 등 최신 경향을 안내하고 스타트업메이트 CEO에게 영감과 창의적인 아이디어를 만들 수 있도록 지원합니다. </p> </div> <div class="feature_content"> <div class="feature_about"> <img src="img/icon-num-02.png" alt=""> <h2>CEO 오프라인 모임 참석(월 2회)</h2> <p> 스타트 업메이트 CEO 회원들만의 오프라인 모임을 월 2회 진행합니다. 온라인에서 부족한 상호작용을 위해 오프라인 모임을 만들고 해당 오프라인 모임에서 다야한 업종의 CEO들과 고민을 나누는 자리가 됩니다. </p> </div> <div class="feature_mockup"> <img src="img/feature-mockup-02.png" alt=""> </div> </div> <div class="feature_content"> <div class="feature_mockup"> <img src="img/feature-mockup-03.png" alt=""> </div> <div class="feature_about"> <img src="img/icon-num-03.png" alt=""> <h2>조직관리를 위한 오프라인 멘토링</h2> <p> 스타트업 메이트에서는 오프라인 멘토링을 정기적으로 개최합니다. 스타트업 메이트 CEO 회원이면 누구나 참석 가능합니다. 오프라인 멘토링에서는 명사를 초빙하여 경영혁신과 조직관리 그리고 최신 경영 트랜드에 대한 강연을 진행합니다. </p> </div> <!-- feature_about --> </div> <!-- feature_content --> </div> <!-- feature_inner --> </section> <!--feature --> .feature{} .feature_inner{ width: 1300px; margin: 0 auto; } .feature_content{ overflow: hidden; margin: 100px 0; } .feature_content > div{ float: left; width: 50%; text-align: center; } .feature_mockup{} .feature_mockup .feature_about{ padding: 0 70px; } .feature_about h2{ font-size: 30px; }
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
background url 이미지 색상
안녕하세요 선생님 background: url(images/wave-line.png) no-repeat center right 100px, linear-gradient(to right, blue, red); 배경색상은 그레디언트로 하고 url 로 깔아준 png 이미지의 색상을 변경하는 속성은 없을까요?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
mobile rwd tester 이 이제 없는거같아요
알려주신 크롬확장프로그램중에 mobile rwd tester 요게 더이상 없는거같은데 대체프로그램으로 뭘써야좋을까요 ?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
질문드려요~
안녕하세요. show, hide, toggle 버튼 알려주신대로 작성하니 잘 작동합니다 그런데 js파일에 click 함수명을 넣으려니까 취소줄이 표시가되어요 이부분은 그냥 두는 건지 어떻게 해결해야할지 질문을 드려보아요
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
flex준 first-child{ order:1;} 문의드려요~
안녕하세요~쌤 이번 강의도 넘 유용하게 듣고 있어요! 문의드릴부분이 feature 모바일변환시 2번쨰 content> feature-about+feature-mock-up 순서라 글자와 사진의 순서를 바꾸쟌아요. 그런데 .feature-content.flex-order > div: first-child{order:1 } 이면 글자고 글자를 먼저 보이라고 준건데 왜 글자가 아래로 내려가고 목업이 위로가게 되나요? 그리고 한가지더 질문이...모바일 작업하실떄 폰트크기가 커서 두줄이 될경우 작게 맞춰주시는데 작업사이즈가 "375"로 하시더라구요. 저는 "768"로 하고 있는데. 그러면 글자가 한줄에 들어올떄가 많거든요. 실제 어떻게 세팅을 하고 작업하는게 결과물 다른분들이 여러폰으로 볼떄 제일 적합한가요? 시즌1 아직 못봤는데 2가 나왔더라구요..ㅋ 다 들어야겠어요~ 감사합니다~! css /* Change order with Flex */ .feature-content.flex-order{ display: flex; flex-direction: column; } .feature-content.flex-order > div:first-child{ order:1; } html <div class="feature-content flex-order"><!-- feature-content 2--> <div class="feature-about ltr wow"> <img src="images/icon-num-02.png"> <h2>CEO 오프라인 모임 참석(월 2회)</h2> <p>스타트 업메이트 CEO 회원들만의 오프라인 모임을 월 2회 진행합니다. 온라인에서 부족한 상호작용을 위해 오프라인 모임을 만들고 해당 오프라인 모임에서 다야한 업종의 CEO들과 고민을 나누는 자리가 됩니다. </p> </div> <div class="feature-mockup rtl wow"> <img src="images/feature-mockup-02.png"> </div> </div>
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
슬라이더 적용
슬라이더 적용 강의를 듣는데 똑같이 입력했는데 적용이 안됩니다 이럴땐 어떻게 해야 하나요..? 오류에는 이렇게 뜨는데 이건 어떻게 해결하면 되나요?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
안녕하세요 질문드립니다
안녕하세요 강의 내용이 실무에 많은 도움이 되는 것 같습니다^^ 강의 내용중 CDN으로 삽입하는 js 파일들(예: slick.js)이나 선생님께서 제공하시는 제이쿼리 소스들을 회사 홈페이지 제작시에 사용해도 되는 지 궁금합니다
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
블라게 이용방법
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. 유익한 강의 잘 듣고 있습니다. 선생님 질문이 하나 있습니다. 블라겟에서 점선으로 같은 tab부분을 이어주는 기능을 어떻게 사용하는지 알고 싶습니다. beautify 기능인것 같은데 사용을 못하고 있습니다. 좋은 기능을 사용하고 싶어서 글을 올립니다.
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
CDN 복사주소가 달라서요..!
9:50 부분에서 cdn 링크 복사해서 가져오는데용,, 현재 cdn홈페이지에서 복사되는 링크가 달라서 그런지 아이콘 <i> 넣었을때 빈 네모칸으로 나와지는데 어떻게 하죵..? 현재 구글창에 cdn 부트스트랩 페이지에서 복사되는 주소는 https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.3/css/fontawesome.min.css 입니다. 강의에서 확인되는 주소로 쳐서 쓸 수 밖에 없을까요..
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
쌤! psd 파일 어디서 다운받을 수 있나요?
쌤! psd 파일 어디서 다운받을 수 있나요?
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
질문입니다!
1)[ceo-access섹션 - html 구조와 내용]강의를 듣다가 div.inner밑에 div.content를 만든이유를 정확히 알고싶습니다! 2)그리고 [포트폴리오실전퍼블리싱]듣고 앱부터 들으라고 해주셔서 듣고있는데요 한번도 선생님께서는 clearfix를 사용안하시던데 혹시 이유가 있나요? 예전 국비지원으로 학원다녔을때 선생님들이 많이 사용하셨는데 내용을 까먹어서요... 3)마지막으로 죄송한데 이번강의후에 [반응형웹사이트Architecture Agency]들을예정인데요 웹디자인기능사 실기문제중 슬라이드관련된 강의가 있을까요? 문제풀다가 슬라이드랑 팝업창이 어려워서요ㅠㅠㅠ 따로 실기강의듣기엔 시간이 많이 부족해서요..ㅜㅜ
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
잘 배우고 있네요 섹션별단계별완성 다 똑같아요
다운받아 압축풀어보니 이미지 똑같아요 수정바랍니다 수고하세요 ^^^
- 미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
welcome section 질문입니다
선생님 안녕하세요~ 다름이 아니라 .welcome 부분에 height:90vh;을 줬을 때 브라우저마다 높이의 차이가 있을 수 있나요? 엣지에서는 선생님께서 구현한 화면이랑 비슷하게 나오는데 크롬에서는 많이 다르게 나와서요 ㅠㅠ 아니면 제가 노트북으로 확인해서 다르게 보이는걸까요? 그리고 .btn부분도 똑같이 적용했는데 모양이 다르게 나옵니다ㅜㅜ 상하 패딩이 안먹히는 느낌이들어요