inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

F3번 오픈뱅킹 modal 창 질문있습니다.

해결됨

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

F 유형에 대해 자꾸 질문 드려서 죄송합니다..ㅠㅠ F1하고 F3번 modal 창을 만들면 푸터 부분에 modal background-color 가 검정색으로 덮혀 지지 않은데 정상일까요? 제가 잘못 만든 줄 알고 선생님께서 올려주신 최종본도 확인해봤는데 쌤 최종본에서도 푸터 부분에 검정색이 적용 안되는 걸 확인해서요..!! 쌤 코드랑 제 코드가 똑같아서 따로 코드는 올리지 않았습니다.. 이 부분이 문제가 되지 않는다면 이제 문제가 되는 유형이 없는 것 같아요..!! 시험 하루 남아서 최종 점검 겸 질문 남깁니다ㅠㅠ 추가 ) Ai 답변을 보고 제 질문이 디자인 쪽으로 보여지는 것 같아서요..! 의문점인 부분이 .modal 의 크기 값을 width:100 % , height: 100% 로 줘서 창의 전체를 어둡게 덮게 만드는 건데, 그 크기 값이 왜 height 100% 임에도 불구하고 footer에는 적용이 안되는 것 질문이었습니다..!

  • HTML/CSS
  • jquery
  • 웹-디자인
띵가 댓글 2 좋아요 1 조회수 246

제 vscode가 이상해요

미해결

입문자를 위한, HTML&CSS 웹 개발 입문

제 vscode 아래쪽에 보시면 노말 모드랑 인서트 모드를 계속 정해줘야해요... 그래서 따라하는데 여러가지 어려움이 있습니다. 제 프로그래은 왜 그런건가요 ㅜㅜ

  • HTML/CSS
Tom Joo 댓글 1 좋아요 0 조회수 337

카페 24 파일질라 부분 질문있습니다.

미해결

퍼블리셔 개인 포트폴리오 홈페이지 제작 완벽 가이드(PDF)

선생님 알려주신대로 잘 따라와서 드디어 포트폴리오 웹사이트가 완성됐네요 감사합니다^^ 위 사진은 교재 내용 일부 캡쳐해왔는데요 카페 24 웹호스팅 신청까지 완료 했고 파일질라 다운받아서 그림대로 따라하는데 6번 고급 에서 기본로컬디렉터리 에는 어떤 파일을 넣어야 하나요? 제 포트폴리오 웹사이트 파일을 넣는건가요?

  • HTML/CSS
  • 웹-디자인
  • 포트폴리오
이종주 댓글 1 좋아요 1 조회수 344

d,e유형 네비게이션 제작시 서브메뉴가 고정이 안됩니다

해결됨

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

강의 de유형 네비게이션 7:55분초를 보면 선생님 서브메뉴는 고정되어서 잘 나오는데 제꺼는 고정이 안되고 자꾸 슬라이드 업 되어서 서브메뉴에 호버를 할수가 없습니다 제생각에는 엡솔루트 준 뒤로 이러는것 같은데..ㅠ 코드올려드립니다 왜이러는걸까요 ㅠㅜ html <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8" /> <title>D-1</title> </head> <link rel="stylesheet" href="./css/style.css" /> <body> <div class="container"> <div class="main-content"> <div class="left"> <div class="header"> <div class="header-logo"></div> <div class="menu"> <ul class="menu1"> <li> <a href="#none"> meun-1</a> <div class="sub-menu"> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> </div> </li> <li> <a href="#none"> meun-1</a> <div class="sub-menu"> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> </div> </li> <li> <a href="#none"> meun-1</a> <div class="sub-menu"> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> </div> </li> <li> <a href="#none"> meun-1</a> <div class="sub-menu"> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> <a href="#none">meun-2</a> </div> </li> </ul> </div> <div class="spot-menu"></div> </div> </div> <div class="right"> <div class="slide"> <div class="slide-img"></div> <div class="slide-banner"> <a href="#none"><img src="./images/banner-01.png" alt=""></a> <a href="#none"><img src="./images/banner-02.png" alt=""></a> <a href="#none"><img src="./images/banner-03.png" alt=""></a> </div> </div> <div class="items"> <div class="shortcut"> <a href="#none" ><img src="./images/shortcut-01.png" alt="shortcut-01" /></a> <div class="shortcut-content"> <h3>얼리버드 선착순 할인 이벤트, 신규강의 최대 30% 할인</h3> <p> 12월은 사랑의 달~ 코딩웍스에서 여러분께 사랑을 뿌려요~ 12월 개강반을 12월 06일까지 접수하는 분들께는 15%~ 20% 의 얼리버드 할인을 제공합니다. 더불어 소중한 리뷰를 꼼꼼히 남겨주시는 분들을 뽑아 더 큰 적립금을 추가지급해 드릴 예정이오니 리뷰도 놓치지 마시고 작성해주세요~^^<br /> <b>기간:2022년 12월 18일~ 12월 25일</b> </p> </div> <a href="#none" ><img src="./images/shortcut-02.png" alt="shortcut-02" /></a> </div> <div class="news-gallery"></div> </div> </div> </div> <div class="footer"> <div class="footer-logo"> <a href="#none" ><img src="./images/footer-logo.png" alt="footer-logo" /></a> </div> <div class="copyright"> 상호 : (주)코딩웍스 | 대표자 : 홍길동 | 개인정보관리책임자 : 성춘향 부장 사업장주소 : 경기도 남양주시 별내동 1234 코딩웍스 빌딩 6층 (주)코딩웍스 </div> <div class="sns"> <a href="#none"><img src="./images/sns-01.png" alt="sns1" /></a> <a href="#none"><img src="./images/sns-02.png" alt="sns2" /></a> <a href="#none"><img src="./images/sns-03.png" alt="sns3" /></a> </div> </div> </div> <script src="./script/jquery-3.7.1.js"></script> <script src="./script/custom.js"></script> </body> </html> css @charset "UTF-8"; body { margin: 0; background-color: #fff; color: #333; } a { text-decoration: none; color: inherit; } /* 전체레이아웃 */ .container { border: 1px solid red; } .main-content { border: 1px solid black; display: flex; } .main-content > div { border: 1px solid black; } .left { width: 200px; } .header { } .header > div { border: 1px solid red; } .header-logo { height: 100px; } .menu { height: 400px; } .menu1 { padding: 0; } .menu1 > li { position: relative; } .menu1 > li > a { background-color: #333; display: block; color: #fff; height: 40px; line-height: 40px; text-align: center; transition: 0.5s; } .menu1 > li:hover > a { border: 1px solid#333; background-color: #333; color: #fff; } .sub-menu { position: absolute; top: 0; left: 100%; width: 100%; display: none; } .sub-menu > a { display: block; text-align: center; height: 35px; line-height: 35px; background-color: #333; color: #fff; transition: 0.5s; } .sub-menu a:hover { background-color: #ffffff; color: #333; } .spot-menu { height: 50px; } .right { width: calc(100% - 200px); } .slide { height: 400px; position: relative; } .slide-img { border: 1px solid blue; height: 400px; } .slide-banner { border: 1px solid green; position: absolute; top: 0; right: 0; } .slide-banner > a > img { width: 180px; display: block; } .shortcut { border: 1px solid black; height: 200px; display: flex; align-items: center; } .shortcut-content { display: block; } .shortcut-content > b { font-weight: bold; } .news-gallery { border: 1px solid red; height: 250px; } .footer { display: flex; align-items: center; height: 100px; } .footer > div { text-align: center; } .footer-logo { width: 200px; } .copyright { width: calc(100% - 430px); } .sns { width: 250px; } .sns > a > img { width: 50px; border-radius: 5px; } js $(".menu1 li").mouseover(function () { $(this).children(".sub-menu").stop().slideDown(); }); $(".menu1 li").mouseleave(function () { $(this).children(".sub-menu").stop().slideUp(); });

  • HTML/CSS
  • jquery
  • 웹-디자인
양신영 댓글 2 좋아요 1 조회수 314

챕터0 3강의 Postfix/Prefix 관련 질문입니다.

미해결

처음 만난 리액트(React)

여기 1-5번까지 출력결과가 a=1이고 b=a++니까 1이 더해져서 1, 2라고 생각했는데 왜 2, 1인건지 이해가 잘 안갑니다!

  • HTML/CSS
  • javascript
  • react
윤하 댓글 2 좋아요 1 조회수 319

플렉스 질문드려요

미해결

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

slide-banner에 플랙스를 주고 slide-banner a img 에 width:100%;를 주면 왜 일렬로 배치될 수 있나요? ■ 질문 남기실 때 꼭! 참고해주세요. - 먼저 유사한 질문이 있었는지 검색해주세요. - 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다. - HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요. - 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다. 질문 하실 때 어떤 유형인지 말씀해주세요. ex) A1 작업하는데 ???이 안됩니다.

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

vscode 에서 html 파일 실행 안되네요

미해결

HTML/CSS 베이스캠프

vscode 사용 질문 입니다. html 파일이 실행 안되네요 하단에 code language not Supported or defined 가 나와서 강의에 설명이 없어서 구글 검색해서 찾아보니 이것저것 하라고 해서 해봤는데 ... 지금은 아에 메세지도 안나오고 아에 안되네요. 참고로 js 파일은 실행이 됩니다. F5 누르고 python file 선택하구 하니 됐구요 html 파일도 처음에는 F5 누르고 install an extension for HTML 문자가 나와서 선택 하구 했는데 안되고, runned code 깔라고 해서 해도 안되고, 지금은 F5 눌러도 아에 안나오네요. 하단에도 code language... 문자도 안나오고 검색해도 별게 없구요 뭐가 잘못 된건가요

  • HTML/CSS
cdway 댓글 1 좋아요 0 조회수 4338

안녕하세요 강사님,

미해결

Do It! 장고+부트스트랩: 파이썬 웹개발의 정석

AWS light sail을 이용하여 배포까지 3월 초에 완료하였습니다. 웹사이트는 잘 작동하였고 너무 기뻐 친구들에게도 자랑을 하였습니다. 그렇게 웹사이트가 잘 작동되고 있었는데 갑자기 어느순간부터 도메인을 치면 오류가 납니다. 제 웹사이트 링크는 giyeons.com 입니다. 구글링을 해보니 aws에 문제가 없었다가 갑자기 생긴것 같은데 제가 aws는 강사님이 하라는데로 따라하기만 하고 추가로 다른 공부를 하진 않아서 어디를 어떻게 수정해야 하는지 감이 안잡힙니다. (제가 아마존 라이트세일 결제 카드를 배포후 2주 후에 잃어버려서 기존 카드를 해지를 하고 aws에 새로운 카드를 등록시켰는데 이것이 문제가 될 수도 있나요?) 새로운 카드를 이미 등록은 하였는데 계속 오류가 나는것을 보아하니 카드의 문제가 아닌것 같습니다.

  • HTML/CSS
  • javascript
  • python
  • django
  • bootstrap
  • aws
  • docker
  • tdd
최기연 댓글 2 좋아요 0 조회수 460

F 유형 slide-banner 질문있습니다

해결됨

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

돌아오는 토요일에 시험을 보는데, 모든 유형 다 만들 수 있어도 혹시 라도 실수할까 복습을 계속 하고 있거든요! 그러다 문득 F 유형 slide-banner 각 이미지 옆에 link 1,2,3,4 라고 적혀있는 글자 입력을 해야 할 경우 어떻게 넣는 게 좋을지 고민하다가 조언 듣고 싶어서 질문 남깁니다. 갤러리에서 사진 밑에 span으로 글자를 입력 해야 하는데, 혹시 배너도 갤러리처럼 링크 설명 글자를 넣으라는 지시가 있을까봐 대비해서 가고 싶습니다!

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

codesandbox 처음부터 안되네요

미해결

2022 30분 요약 강좌 시즌 1 : HTML, CSS, Linux, Bootstrap, Python, JS, jQuery&Ajax

처음부터 막히네요 코드샌드박스 - index.html 누르면 기본 코드가 나오는데 여기서 전혀 삭제, 편집이 안되네요 삭제하면 한줄 메세지가 나오는데 Editor is read-only because the file system of the file is read-only. 입니다. 어디가 잘못 된 걸까요

  • HTML/CSS
  • javascript
  • python
cdway 댓글 2 좋아요 0 조회수 696

ChatGPT 프롬프트? 설정관련

해결됨

ChatGPT API 입문 강의 - 30분 만에 다국어 번역기 웹 풀스택 개발하기

강의 감사합니다, 신현님 추가로 더 궁금한 점이 있는데 ChatGPT API를 사용해서 웹에서 스무고개 게임을 하는 지피티를 만들고 싶은데 어떤 말투나(친구처럼 친근하게), 20회 답변 제한 등의 조건들을 구현할 수 있을까요?

  • HTML/CSS
  • python
  • chatgpt
이면지 댓글 1 좋아요 0 조회수 384

임시이미지 사이트 close

미해결

퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)

HTML 교재 19 페이지 http://placehold.it 열리지 않아요, 없어진것 같음 다른 사이트 알려주세요 그리고 13페이지 한글입숨 사이트 열리지 않아요, 일시적인지 는 몰라도 찾아보니 http://guny.kr/stuff/klorem/ 여기 지원되네요

  • HTML/CSS
  • jquery
  • flex
cdway 댓글 2 좋아요 1 조회수 285

gpt api를 파이썬에서만 사용할 수 있나요?

해결됨

ChatGPT API 입문 강의 - 30분 만에 다국어 번역기 웹 풀스택 개발하기

안녕하세요, 강의 실습을 python으로 진행하셨는데 만약 웹 사이트 백엔드 개발을 java spring boot를 사용한다면 gpt api를 강의처럼 사용할 수 있을까요?

  • HTML/CSS
  • python
  • chatgpt
이면지 댓글 1 좋아요 0 조회수 408

곡선에 따라 글자쓰기에서 path 대신 circle은 안되나요?

미해결

SVG 마스터

<svg width="500" height="500" xmlns="http://www.w3.org/2000/svg"> <style> .svg-circleText {font-size: 1.5rem; font-weight: bold; fill: red;} .svg-circleText tspan {display: inline-block; margin-right: 30px;} </style> <defs> <circle id="text-circle" cx="250" cy="250" r="240" stroke="blue" fill="transparent" /> </defs> <text x="20" y="20" class="svg-circleText"> <textPath href="#text-circle"> <tspan>My Work</tspan><tspan>My Work</tspan><tspan>My Work</tspan> <tspan>My Work</tspan><tspan>My Work</tspan><tspan>My Work</tspan> <tspan>My Work</tspan><tspan>My Work</tspan><tspan>My Work</tspan> </textPath> </text> </svg> 위처럼 circle로 하고싶은데 나오지 않습니다. 각각 따로 하면 circle도 잘 보이고 글자도 잘 보입니다. 하지만 id와 textPath를 사용하여 연결하면 보이지 않습니다ㅠ

  • HTML/CSS
  • svg
hweejin_cha 댓글 1 좋아요 0 조회수 350

언어 설정 -> 한글

해결됨

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

vscode 다운받았는데 언어를 한국어로 바꾸고 싶은데 설정 어디서 해야되나요 ?

  • HTML/CSS
  • javascript
히응 댓글 1 좋아요 0 조회수 360

화면 반영 안됨

미해결

입문자를 위한, HTML&CSS 웹 개발 입문

계속 이런 식으로 떠요 어떤 게 문제일까요? 초기화도 해봤는데 똑같이 저런식으로만 뜹니다 코드는 기본으로만 짜서 코드문제는 아닌 것 같습니다

  • HTML/CSS
이수용 댓글 1 좋아요 0 조회수 314

안녕하세요 foo님 백엔드 개발자 프론트 앤드 강의에서 질문이 있습니다.

해결됨

백엔드 개발자에 의한, 백엔드 개발자들을 위한 프론트엔드 강의 - 기본편

안녕하세요 foo님 강의에서 질문이 있습니다. css를 적용하는 방법과 선택자 챕터에서 가상 클래스인 a:hover는 왜 style 탭에서 적용된 속성이 안보이는지 궁급하니다!

  • HTML/CSS
  • javascript
  • bootstrap
강한 타조 댓글 1 좋아요 0 조회수 269

css background-image 적용이 안 돼요

해결됨

HTML5 CSS3 기초 & 반응형 웹 템플릿 만들기!

index.html파일에서 style태그로 작성하면 돌고래 사진이 잘 나오는데 style.css에서 작성하면 백그라운드 컬러만 적용되고 사진이 표시되지 않습니다. 왜 이런가요??

  • HTML/CSS
  • 반응형-웹
nao505 댓글 1 좋아요 1 조회수 566

Section 13 Card 컴포넌트 실습 스타일링 질문

미해결

처음 만난 리액트(React)

안녕하세요, 덕분에 재밌게 리액트 공부하고있는 직장인입니다. 섹션13 카드 컴포넌트 실습에서 소플님 코드에서는 Inline styling 으로 backgroundColor: backgroundColor || 'white' 라고 적어주셨는데 제가 css.module 스타일파일을 만들어서 style sheet에서 import 해서 쓰고싶으면 prop으로 받은 background 를 style sheet 에 어떻게 넘겨줄수있는지 궁금합니다.

  • HTML/CSS
  • javascript
  • react
C++초보입니다 댓글 2 좋아요 1 조회수 293

인기 태그

인프런 TOP Writers

주간 인기글