inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

강의 관련 질문

미해결

모바일 웹 퍼블리싱 포트폴리오 with Figma

안녕하세요 선생님. 강의 항상 잘 보고 있습니다. 오늘 모바일웹 강의 결제하여 듣기 시작한 수강생인데요~ 현재 신입 퍼블리셔이고, 모바일 웹 프로젝트를 한다고 하는데 회사에 사수도 없고 모바일웹은 해본적이 없어 미리 준비할 겸 수강하게 되었는데요~ 제가 따로 디자인 부분은 하지 않고 디자인툴(포토샵 or 피그마)에 있는 디자인 시안으로 이미지 추출하고 디자인 시안 보고 퍼블리싱 하는 작업을 진행할 예정입니다. 그래서 수강 목적은 모바일웹 퍼블리싱 하는것을 배우기 위함 이라고 생각하시면 됩니다! 혹시 이러한 경우에는 디자인 파트인 섹션1 강의도 들어야 되는 걸 까요~? 아님 안 들어도 무관할까요? 답변 미리 감사드립니다!

  • HTML/CSS
  • jquery
  • 모바일-디자인
  • figma
  • 포트폴리오
rb 댓글 1 좋아요 1 조회수 345

로비 채팅 구현 섹션에서

해결됨

파이썬/장고로 웹채팅 서비스 만들기 (Feat. Channels) - 기본편

안녕하세요 로비 채팅 구현 강의를 들으면서 구현 중인데 redis 서버도 정상적으로 잘 작동하고 스크립트도 정확하게 썼는데 계속 채팅을 입력하고 엔터를 누르면 새로고침(초기화)이 되네요 ㅠㅠ 어떤게 문제일까요? 아무리 문제를 해결해봐도 이상한점은 찾아볼수가 없네요

  • python
  • django
  • django-channels
오창인 댓글 1 좋아요 0 조회수 306

푸터 부분이 안보여요.

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

<!DOCTYPE html> <html lang="kor"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <div class="left"> <header> <div class="header-logo"> <a href="#none"><img src="images/logo-header.png" alt="logo header"></a> </div> <div class="navi"></div> </header> </div> <div class="right"> <div class="slide"> <div></div> </div> <div class="items"> <div class="news"></div> <div class="gallery"></div> <div class="shortcut"></div> <footer> <div class="copyright"> 동문경조사, 동문행사일정, 사용자매뉴얼 상호 : (주)이스타컴퍼니 | 대표자 : 최종윤 | 개인정보관리책임자 : 이주현 부장 <br> 사업장주소 : 인천광역시 중구 개항로 6층 (주)이스타컴퍼니 </div> <div class="sns"> <div></div> <div></div> </div> </footer> </div> </div> </div> <script href="script/jquery-1.12.4.js" type="text/script"></script> <script href="script/custom.js" type="text/script"></script> </body> </html> @charset 'utf-8'; body { margin: 0; background-color: #fff; color: #222328; font-size: 15px; } a { color: #222328; text-decoration: none; } .container { width: 1000px; } .container > div { float: left; box-sizing: border-box; } .left { width: 200px; } .right { width: 800px; } header {} .header-logo { border: 1px solid #000; height: 100px; } .navi { border: 1px solid #000; height: 400px; } .slide {} .slide > div { border: 1px solid #000; height: 350px; } .items { overflow: hidden; } .items > div { border: 1px solid #000; height: 200px; float: left; box-sizing: border-box; } .news { width: 300px; border: 1px solid #000; } .gallery { width: 300px; border: 1px solid #000; } .shortcut { width: 200px; border: 1px solid #000; } footer { overflow: hidden; } footer > div { border: 1px solid #000; height: 100px; float: left; box-sizing: border-box; } .copyright { width: 600px; } .sns { width: 200px; } .sns div { height: 50px; border: 1px solid #000; box-sizing: border-box; } footer에 overflow: hidden; 을 지우면 라인이 보이는데, 다시 넣으면 안보여요. 뭐가 잘못된걸까요?

  • HTML/CSS
  • jquery
  • 웹-디자인
원스텝 댓글 1 좋아요 1 조회수 338

chapter06-질문

미해결

처음 만난 리액트(React)

26줄 notifications 과 31줄 notifications 차이점 ? 26줄 notifications22 로 수정, 39줄 notifications22로 수정 50줄 this.state.notifications22 했더니 에러가 발생해서요 this.setState({ // this.setState({}) 함수로 state를 update 한다 notifications: notifications, //이 부분 설명 좀 부탁합니다 });

  • HTML/CSS
  • javascript
  • react
정하 댓글 1 좋아요 1 조회수 555

d 1 레이아웃 연습중에 궁금한것이 있어서 질문 남깁니다.

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>D 타입 연습</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <div class="main-content"> <div class="left"> <header> <div class="header-logo"></div> <div class="navi"></div> <div class="spot-menu"></div> </header> </div> <div class="right"> <div class="slide"> <div class="slide-image"></div> <div class="slide-banner"></div> </div> <div class="items"> <div class="shorcut"></div> <div class="news-galley"></div> </div> </div> </div> <footer> <div class="footer-logo"></div> <div class="cpoyright"></div> <div class="sns"></div> </footer> </div> <script src="script/jquery-1.12.4.js"></script> <script src="script/custom.js"></script></body></html> ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ @charset "utf-8"; body { background-color:#fff; color:#000; margin:0;} a { text-decoration:none; color:#000;} .container {} .main-content { display:flex;} .left { width:200px; border:1px solid #000;}.right { flex:1; border:1px solid red;} header {} .header-logo { height: 100px; border:1px solid red;} .navi { height:400px; border:1px solid #000;} .spot-menu { height: 50px; border:1px solid red;} .slide { height:400px;} .slide-image { border:1px solid green; height:inherit;} .slide-banner { width:150px; height: 300px; border: 1px solid red; position:absolute; top:0; right:0;} .items {}.shortcut { height:200px; border: 5px solid gold;} .news-gallery { height:250px; border:1px solid blue;} footer { display: flex;} footer > div { border:1px solid #000; height:100px;} .footer-logo { width: 200px;} .copyright { flex:1;} .sns { width:300px;}

  • HTML/CSS
  • jquery
  • 웹-디자인
댓글 1 좋아요 1 조회수 373

next.js의 "_buildmanifest.js" 파일의 경로 유출(?)은 괜찮은 걸까요?

미해결

소스코드에서 _buildmanifest.js에 들어가보면 모든 경로가 표시되던데 이러면 관리자 페이지의 모든 경로도 볼 수 있어서 어느정도 앱 규모(?)를 알 수 있다는 건데 이거 보안적으로 괜찮은걸까요? 관리자 페이지는 따로 만들어야 하는 건지 아니면 slug 경로를 이용해서 안 보이게 해야하는 건지 갑자기 머리가 복잡해지네요😂 다른 분들은 어떻게 하시는지 궁금합니다.

  • next.js
웹나그네 댓글 1 좋아요 0 조회수 431

git 허브나 netlify 용량

미해결

자바스크립트 : 기초부터 실전까지 올인원

git 허브나 netlify를 통해 쉽고 유용하게 도메인얻는 방법 너무 잘 들었습니다. 궁금한 부분은 git hub에 올리는 용량은 제한이 없나요? git hub에 올리는 용량과 netlify의 용량은 상관이 없는지 궁금합니다. 좋은 강의에 항상 감사드립니다.

  • HTML/CSS
  • javascript
openuriz 댓글 1 좋아요 0 조회수 1284

slider 적용이 안되어서 올립니다

미해결

반응형 웹사이트 포트폴리오(Architecture Agency)

<div class="history-info"> <h2>History</h2> <hr class="bar" /> <div class="history-slider"> <div> <h4> The Project<br />of Architect for the <span>2013</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> <div> <h4> The Project<br />of Architect for the <span>2014</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> <div> <h4> The Project<br />of Architect for the <span>2015</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> <div> <h4> The Project<br />of Architect for the <span>2016</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> <div> <h4> The Project<br />of Architect for the <span>2017</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> <div> <h4> The Project<br />of Architect for the <span>2018</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> <div> <h4> The Project<br />of Architect for the <span>2019</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> <div> <h4> The Project<br />of Architect for the <span>2020</span> </h4> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet praesentium ipsum dolor consectetur officia nobis veritatis qui doloribus impedit quia! </p> </div> </div> </div> 도저히 문제를 못찾겠습니다 한시간동안 체크했는데 답이 안나오네요..

  • HTML/CSS
  • jquery
  • 웹-디자인
  • 반응형-웹
heejaelim02 댓글 2 좋아요 1 조회수 557

diary-date 부분 질문

해결됨

[코드캠프] 강력한 CSS

여기서 display:flex; 입력시 왜 text -align은 적용안되는지 궁금합니다! .diary-date{ font-size:14px; color:gray; text-align:right; }

  • HTML/CSS
yh 댓글 1 좋아요 0 조회수 333

<header>와 <div class="header"> 둘다 사용해도 상관없나요?

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

<header> <footer> 시맨틱태그와 <div class="header"> 클래스 네임 중에 어떤방식으로 시험을 봐야할까요? 둘 다 상관없나요? 강의 화면이랑 다운받은 html 다른 경우도 있는 것 같아서요~

  • HTML/CSS
  • jquery
  • 웹-디자인
원스텝 댓글 1 좋아요 1 조회수 546

SendGird가입

미해결

파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트

안녕하세요 api 인증키를 발급받기 위해 sendgrid를 가입하려고 하는데 가입이 되지 않아서 질문남깁니다!!

  • react
  • python
  • django
  • docker
chlendyd7 댓글 3 좋아요 1 조회수 1126

[스크롤 높이 세팅] scrollHeight값이 3990아닌 4645로만 나오는데 뭐가 문제일까요? ㅠㅠ

미해결

애플 웹사이트 인터랙션 클론!

(() => { const sceneInfo = [ { // 0 type: 'sticky', heightNum: 5, // 브라우저 높이의 5배로 scrollHeight 세팅(디바이스 마다 높이가 다르기에 각 기계가 가진 높이를 불러오고 곱해준다.) scrollHeight: 0, }, { // 1 type: 'normal', heightNum: 5, scrollHeight: 0, }, { // 2 type: 'sticky', heightNum: 5, scrollHeight: 0, }, { // 3 type: 'sticky', heightNum: 5, scrollHeight: 0, } ]; function setLayout() { //각 스크롤 섹션의 높이 세팅 for (let i = 0; i < sceneInfo.length; i++) { sceneInfo[i].scrollHeight = sceneInfo[i].heightNum * window.innerHeight; } console.log(sceneInfo); } setLayout(); })(); 4645값으로 그대로 진행해도 될까요?

  • HTML/CSS
  • javascript
  • 웹-디자인
  • svg
  • 인터랙티브-웹
  • 클론코딩
gari 댓글 2 좋아요 0 조회수 621

float: right 요소가 아래에 배치되는 이유 쉽게 설명

미해결

중상급 퍼블리싱을 위한 CSS3의 모든 것

강의에서 나온 것처럼 하나는 float:left 하나는 margin:auto 하나는 float: right시 마지막 요소가 아래에 배치됩니다. 생각해보면 이것은 너무나도 당연한 것입니다. 마지막 요소의 float:right을 꺼보면 이렇게 되죠. 왜 이렇게 되는지 모르겠다면, 그냥 float와 margin:auto를 적용시키지 않고, div 요소 3개를 그냥 그대로 놔두면 이렇게 차곡차곡 쌓이게 되죠! 그렇기에 마지막 요소를 float: right을 하면 자기가 갈 수 있는 가장 오른쪽으로 가게 되는 거죠 그러면 다시 돌아가서 왜 첫번째 요소는 float:left를 했을때 중간 요소와 같은 줄에 있는 거고, 2,3 요소 순서를 바꾸면 해결이 될까요? 우선 1번 요소가 float:left로 배치가 되어도 없는 아이처럼 작동하죠. 그러니까 중간 요소가 배치될때는 1번 요소는 없는 것처럼 무시를 하고 혼자만 있을 때 처럼 가운데에 오게 되겠죠. 그러나 2,3 요소 순서를 바꾸면 원래처럼 1번 요소는 왼쪽에 가고, 그다음에 오는 것이 3번(float:right)요소가 되니까 이 아이도 1번 요소가 없을때와 동일하게 그냥 오른쪽으로 가겠죠. 그다음에 2번 요소(margin:auto)가 배치 되려고 하는데, 이전에는 1번 요소만 무시했다면 이번에는 1,3 요소 모두 무시하고 그냥 아무것도 없는 것처럼 가운데에 오게 되는 거죠!

  • HTML/CSS
alvinlog 댓글 1 좋아요 1 조회수 913

강의자료 다운로드 어디서 하나요?

미해결

[ 부트스트랩 5 ] 빠르고 스마트하게 웹 사이트 만들기 | Bootsrap 입문용

강의자료 다운로드 어디있나요??

  • HTML/CSS
  • bootstrap
LEE 댓글 2 좋아요 0 조회수 427

html 표 태그 강의

미해결

[웹 개발 풀스택 코스] HTML&CSS 기초

html 표 태그에서 6분 44초에 <tbody>안에 <tr>넣고 <tr>전체를 앞으로 한 번에 옮긴 건 어떤 단축키를 누른건가요?

  • HTML/CSS
kbtusno12 댓글 1 좋아요 0 조회수 388

requirements.txt 질문

해결됨

실전 프로젝트로 배우는 데이터 앱 만들기 with Python & Streamlit

안녕하세요 강의자료에는 requirements.txt가 안보이는 것 같은데 혹시 어디서 다운받을 수 있을까요? 버전 충돌이 발생해서요ㅠ

  • python
  • streamlit
이시현 댓글 1 좋아요 0 조회수 475

class 와 id 작성 순서

해결됨

[코드캠프] 시작은 프리캠프

<div class="token__wrapper"> <div class="token" id="token">000000</div> 여기서 div class="token" 이랑 id "token" 순서를 반대로 하면 왜 컬러가 안 입혀지나요? css 적용순서가 달라지게 되나요?

  • HTML/CSS
  • javascript
yh 댓글 1 좋아요 0 조회수 464

파이널 과제 onkeyup="onchange()" 관련 질문

해결됨

[코드캠프] 시작은 프리캠프

안녕하세요 파이널 과제를 한 후 레퍼런스와 검토 중인데요, 1/ 수업시간엔 changeFocus()로 알려주셨는데, 굳이 onchange="changePhone2()" onkeyup="onchange()" 로 사용된 이유가 있을까요? 굳이 두개로 나눠서 사용한 이유가 궁금합니다. 2/ 해당 코드가 "키보드를 눌렀다 때면 onchange함수를 실행시켜줘. onchange는 changePhone함수를 실행시킨다는 의미야," 라는 의미일까요? 찾아봤지만 명쾌하게 이해가 되지 않아 질문합니다.

  • HTML/CSS
  • javascript
yh 댓글 1 좋아요 0 조회수 327

제이쿼리 적용이 안돼요.

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

안녕하세요 선생님. 제이 쿼리 적용이 안돼서 궁금해서 여쭤봅니다. <script type="text/javascript" src=" script/jquery-1.12.4.js "></script> <script type="text/javascript" src=" script/custom.js "></script> 요렇게 적용하라고 하셔서 그대로 했을때는 되는데, js파일을 script 폴더에 넣지않고 밖으로 뺀다음 <script type="text/javascript" src=". ./jquery-1.12.4.js "></script> 요렇게 .. 처리해서 같은 폴더내에 넣으려고 하는데 적용이 안되더라구요. 혹시 제이쿼리는 요렇게 하면 안되는것일까요? 그리고 폴더에 넣는 편이 실무나, 정리 면에서 확실히 더 도움이 되나요...?

  • HTML/CSS
  • jquery
  • 웹-디자인
김유나 댓글 2 좋아요 1 조회수 831

object-fit 속성 사용법

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

D E 유형 필독사항에서 object-fit 속성 강의에서 object-fit 속성을 사용할 때 부모요소의 너비 높이가 반드시 지정되어 있고 그 너비와 높이를 object-fit 속성이 들어간 img가 똑같은 값으로 받아와야 한다(inherit)고 했는데, 부모요소의 너비높이가 없이, inherit 없이도, img의 너비나 높이만 있어도 구현되던데, 문제가 있을까요? 아래처럼 해도 될까요? 꼭 반드시 부모요소의 너비높이가 있어야되고 inherit로 받아와야만 하나요? 참고로 아래는 D1 유형 중 슬라이드부분 입니다. <div class="slide"> <div class="slide-image"> <a href="#none"><img src="images/slide-d-01.jpg"alt="slide-d-01"></a> <a href="#none"><img src="images/slide-d-02.jpg"alt="slide-d-02"></a> <a href="#none"><img src="images/slide-d-03.jpg"alt="slide-d-03"></a> </div> </div> .slide{ position: relative; /**/ overflow: hidden; width: 400px; } .slide-image{ font-size: 0; animation: slide 10s linear infinite; } .slide-image img{ width: 100%; height: 400px; object-fit: cover; }

  • HTML/CSS
  • jquery
  • 웹-디자인
  • object-fit
  • cover
key 댓글 1 좋아요 1 조회수 405

인기 태그

인프런 TOP Writers

주간 인기글