inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

iframe 질문입니다.

미해결

면접과 취업을 부르는 '퍼블리셔 개인 포트폴리오 홈페이지' 제작

안녕하세요 현재 목업 단계에 있는데 iframe에 다른 파일에서 만든 html의 주소를 삽입해야 하는데 http 주소가 아니다 보니 실행이 잘 안됩니다.. 어떻게 해야 될까요? 그리고 포트폴리오 오프라인 강의 계획이 또 있으신지 궁금합니다.

  • HTML/CSS
  • jquery
  • 포트폴리오
wang 댓글 1 좋아요 1 조회수 220

구조 가상 클래스 셀렉터에대해서 질문있습니다

미해결

풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]

모던 웹을 위한 상세한 모던 CSS Selector 정리3[2:49]에서 셀렉터에 따른 css적용 모습을 보여주셨는데, css가 아래와 같이 작성된 상태에서 p:first-child { color: red; } p:last-child { color: blue; } p:nth-child(2) { color: green; } p:nth-last-child(2) { color: purple; } <body> <div> <p>1번</p> <p>2번</p> <p>3번</p> <p>4번</p> <p>5번</p> </div> </body> 의 결과값은 <body> <p>1번</p> <p>2번</p> <p>3번</p> <p>4번</p> <p>5번</p> </body> 의 결과값은 이렇게 나오는데, 왜 이런 차이가 발생하는 것인가요? 제 생각엔, <div>태그가 없더라도 <body>태그를 기준으로 하면 last-child가 적용되는 자식 요소의 순서는 똑같아야 할 것 같은데 그 이유가 궁금합니다

  • HTML/CSS
  • javascript
  • es6
phj970701 댓글 2 좋아요 0 조회수 318

5장 회귀 실습 2:캐글경연 주택가격 예측-Advanced Regression Techniques - 01 질문 있습니다😊

미해결

[개정판] 파이썬 머신러닝 완벽 가이드

선생님 안녕하세요! 5장 회귀 실습 2:캐글경연 주택가격 예측-Advanced Regression Techniques - 01 을 듣다가 타겟 값인 Price를 로그 변환하여 정규 분포 형태로 변환하고, 피처들 중 숫자형 컬럼의 Null 값 데이터 처리 부분 코드를 다음과 같이 썼습니다. 그런데 결과가 사진과 같이 float64가 포함된 형태로 나왔습니다. 제가 어떤 부분에서 잘못한 건지, 그리고 어떻게 해야 선생님과 같은 결과가 나올 수 있나요?ㅎㅎ # SalePrice 로그 변환 original_SalePrice = house_df['SalePrice'] house_df['SalePrice'] = np.log1p(house_df['SalePrice']) # Null이 너무 많은 컬럼들과 불필요한 컬럼 삭제 house_df.drop(['Id', 'PoolQC', 'MiscFeature', 'Alley', 'Fence', 'FireplaceQu'], axis=1, inplace=True) # Drop하지 않는 숫자형 Null 컬럼들은 평균 값으로 대체 num_columns = house_df.dtypes[house_df.dtypes !='object'].index.to_list() house_df[num_columns].fillna(house_df[num_columns].mean(), inplace=True) # Null 값이 있는 피처명과 타입을 추출 null_column_count = house_df.isnull().sum()[house_df.isnull().sum() > 0] print('## Null 피처의 Type :\n', house_df.dtypes[null_column_count.index])

  • python
  • 머신러닝
  • 통계
곽민선 댓글 1 좋아요 0 조회수 240

이 강의 들으려면 뭘 선행 학습 해야 하죠?

미해결

만들면서 배우는 HTML/CSS

html 자바스크립트 css 한번도 안해봤는데 강의가 전혀 이해가 안가요 자바 기초는 조금 들었어요 20분 강의를 1시간 넘게 끊어가며 앞뒤로 돌려보고, 다른분들 커뮤니티 질문 보고 있는데 한계네요...

  • HTML/CSS
coolbigtree 댓글 2 좋아요 0 조회수 328

:after에 설명해주신 css 차이가 이해가 어렵습니다.

미해결

웹퍼블리셔가 알려주는 실무 웹사이트 따라만들기 Season1

header .lnb li a span:after {position: absolute; left:0; bottom:0; content:""; display:block; width: 100%; height: 1px; background: #2d5b79;} header .spot li:after {content:""; position: absolute; left: 0; top: 50%; width: 1px; height: 7px; background: #ccc; transform: translateY(-50%); } 1강에서 40분쯤에 이렇게 강의를 해주셨는데 span:after 에는 display:block;을 주셨고 li:after 에는 display:block; 을 안주셨더라고요 둘 다 똑같이 선을 만드는 css인데요 (차이는 좌우에 만드느냐, 아래에 만드느냐) 이 두개의 차이는 뭔지 설명 좀 부탁드리겠습니다 : ) ㅜㅜ

  • HTML/CSS
rooftop7788 댓글 1 좋아요 0 조회수 354

import- export 필수

해결됨

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

약 7분경 css는 그냥 import로 불러오시는 강의 내용이 있는데요, 이전에 import를 하기 위해선 원본 파일에서 꼭 export를 해줘야한다고 말씀해주셨던 것 같아서요. js파일과 다르게 css 파일을 불러올때는 꼭 export를 하지 않아도 되는 걸까요?

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
igh22 댓글 1 좋아요 0 조회수 226

네비게이션 클릭시 헤더높이로 인해 제목 가리는 부분 해결방안

미해결

SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma

선생님, 안녕하세요:) 강의 유익하게 잘 보고 있습니다. 좋은 강의 해주셔서 몰랐던 부분을 정말 많이 알아갑니다! 'PC 레이아웃 상세 퍼블리싱 - 강의소개 05(네비게이션 부드럽게 스크롤링)' 강의에서 헤더 높이로 인해 제목 부분이 가려지는 문제를, 헤더 높이를 빼주면 해결되지 않을까 싶어 작성해보았습니다. /* Smooth Scrolling */ var linkLocation = $(this).attr('href'); $('html, body').animate({ scrollTop: $(linkLocation).offset().top-'180' // <- 작성한 부분 }, 500); e.preventDefault(); 헤더 높이인 123px보다 더 많은 값인 180을 주니 제목이 가리지 않고 알맞게 스크롤되는데 이 방법이 맞는건지, 이렇게 했을 때 다른 문제가 발생하지 않는지 궁금하네요!

  • HTML/CSS
  • javascript
  • sass
  • jquery
  • scss
Ji Young. 댓글 1 좋아요 4 조회수 329

disabled 디자인 이렇게 하면 될까요?

해결됨

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

안녕하세요... 강의 3분 8초에 나오는 체크된 부분 퍼블리싱에 대해 질문드립니다.. 라이브 서버로는 되는 것 같기는 한데 혹시 더 낫게 하는 방법이나 실무에서 더 선호되는 방법이 있다면 알려주시면 감사하겠습니다... <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="https://kit.fontawesome.com/c0fe093804.js" crossorigin="anonymous"></script> <link rel="stylesheet" href="02.fontawesome-active.css"> </head> <body> <form> <input type="checkbox" id="chk1" checked> <label for="chk1">HTML</label> <input type="checkbox" id="chk2"> <label for="chk2">CSS</label> <input type="checkbox" id="chk3"> <label for="chk3">Javascript</label> <input type="checkbox" id="chk4" disabled> <label for="chk4">UIKit</label> </form> </body> </html> /* Google Web Fonts CDN Raleway */ @import url('https://fonts.googleapis.com/css?family=Raleway&display=swap'); /* Google Web Fonts CDN Noto Sans KR */ @import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700,900&display=swap'); @import url('https://kit.fontawesome.com/c0fe093804.js" crossorigin="anonymous'); body{ font-family: 'Raleway', sans-serif; /* font-family: 'Noto Sans KR', sans-serif; */ color: #222; line-height: 1.5em; font-weight: 300; margin: 0; font-size: 30px; display: flex; justify-content: center; align-items: center; height: 100vh; } a{ color: #222; text-decoration: none; font-size: 12px; } form input[type=checkbox]{ display: none; } form label{ display: block; margin-bottom: 3px; } form label:before{ content: '\f00c'; text-align: center; line-height: 30px; font-family: fontawesome; margin-right: 8px; border: 1px solid #292929; color: transparent; display: inline-block; width: 30px; height: 30px; vertical-align: middle; padding: 2px; border-radius: 3px; font-size: 30px; transition: 0.2s; } form input[type=checkbox]:checked + label:before{ background-color: crimson; color: #fff; border: 1px solid crimson; /* border-color: transparent; */ } /* 눌리는 효과 */ form input[type=checkbox] + label:active:before{ transform: scale(0); } form input[type=checkbox]:disabled + label:before{ border: 1px solid rgba(220, 20, 60, 0.233); background-color: rgba(220, 20, 60, 0.233); color: #fff; } form input[type=checkbox]:disabled + label:active:before{ transform: scale(100%); }

  • HTML/CSS
d111 댓글 1 좋아요 1 조회수 292

테스트 코드 오류

미해결

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

안녕하세요 선생님, 좋은 강의 항상 감사하게 잘 듣고 있습니다. 제가 지금 카테고리를 테스트 하는 강의를 수강하고 있습니다. 그런데 아무리 테스트를 하여도 blog/ test.py 83번째 줄에서 Nonetype 오류가 나옵니다. id를 제대로 html에 부여 하였고 대문자, 소문자, 특수기호를 모두 확인하였습니다. 그래서 제 지식으로는 오래 생각을 해 보아도 틀린 부분을 찾을 수 없어서 어느 부분이 틀린 부분인지 선생님께 여쭤보고자 연락을 드립니다. 아래 제 깃허브 url을 첨부하도록 하겠습니다. 감사합니다. https://github.com/rapgodd/django_2023.git

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

chapter5 실습질문입니다.

미해결

처음 만난 리액트(React)

이와같이 나오는데 어떤부분에서 잘못되었을까요? 두번세번봐도 어디가 잘못됬는지 모르겠네요 ㅠㅠ

  • HTML/CSS
  • javascript
  • react
chicmania 댓글 1 좋아요 1 조회수 786

python-telegram-bot 2021년 20 버전 이후

미해결

파이썬으로 영화 예매 오픈 알리미 만들기

python-telegram-bot 20 버전부터는 비동기 프로그래밍이 적용되어 강의와는 다른 코드가 필요합니다. https://github.com/python-telegram-bot/python-telegram-bot/wiki/Introduction-to-the-API 위 깃허브 python-telegram-bot 공식 위키 페이지로 가시면 필수적이고 간단한 용례들을 보실 수 있습니다.

  • python
FastCampus 댓글 1 좋아요 0 조회수 1127

grid-template-columns에 대하여

미해결

따라하며 배우는 HTML, CSS

함께 코드로 이해하는 부분에서, 강사님과 똑같이 코드를 작성했는데 아래 사진처럼 그리드가 만들어집니다. 맨 윗 줄은 auto의 개수만큼 정렬이 잘 되는데, 두 번째 줄부터는 세로로 일렬로 나열됩니다. 어떻게 해결하면 좋을까요??

  • HTML/CSS
00.prft 댓글 1 좋아요 0 조회수 215

섹션3 모바일네이게이션 퍼블리싱 모바일트리거 관련

미해결

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

섹션3 모바일 전체 레이아웃 및 네비게이션 퍼블리싱(모바일버전)의 3강 모바일트리거 GNB 보이기 감추기까지 관련하여서 제가 잘못한것 같아서 계속 동일한 강의를 3번이나 보고 잘못된게 없는지 확인했는데, 선생님과 어떠한 점에서 코드가 다른지 찾을 수가 없습니다. 그래서 무엇이 잘못되었는지, 트리거가 작동은 하나 한번 닫은 후 햄버거메뉴가 보여야 하는데 gnb가 active되어있어도 머가 문제인지 모르겠습니다. 어째서 첫 로딩 후, 보이고, 닫기버튼을 누른 후, 햄버거 메뉴 자체가 안보일까요? 그래서 아래의 다른 학습자님의 글을 보고 추가도 해봤지만 안되네요. 제가 어떤걸 잘못했길래 보이지 않는걸까요?

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

css 관련 질문 있습니다.

해결됨

UIUX 포트폴리오 Part.3 - 반응형 웹 포트폴리오

안녕하세요 강의 잘 수강하고 있습니다. 다름이 아니라 s1_list , s2_list 의 내용을 html에 목록 태그로 정의하고 css 디자인 입히셨는데요 이 부분을 s1_list s2_list에 display:flex 속성을 주어서 정렬을 해도 괜찮을까요? flex 속성을 활용하여 만들어보고 싶어서 여쭤봅니다! 혹시나 이 속성을 적용하면 단점이라던지 불편한 점이나 불가능한 부분이 있을까요 pc 버전등에서 디자인이 변경될때 좀 더 용이한가 싶어서 이 부분을 수정해서 포폴에 활용해 볼까 합니다!

  • HTML/CSS
  • javascript
  • jquery
  • 반응형-웹
  • media-query
박동윤 댓글 1 좋아요 1 조회수 271

flex-shrink 질문입니다

미해결

따라하며 배우는 HTML, CSS

flex-shrink 코드를 똑같이 따라 치고, Item의 수를 4개에서 5개로 늘리면 shrink가 적용되지 않았습니다. shrink가 적용되는 조건에 개수 혹은 너비의 합이 있는 건지 궁금합니다!

  • HTML/CSS
00.prft 댓글 1 좋아요 0 조회수 232

툴팁을 요소의 정중앙에 위치시키기 질문

해결됨

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

안녕하세요. 실전 퍼블리싱 파트1 강의 중 마우스오버 시 툴팁 나타나게 하는 부분 듣고 있는데요, span 태그의 transform 속성을 이용해서 툴팁이 아이콘의 너비에 상관없이 아이콘의 정중앙에 오게 하는 방법이 이해가 되지 않아 질문드립니다. 강의에 보면 left: 50%; transform: translateX(-50%); 위와 같이 속성을 부여하면 된다고 말씀하셨는데, translateX 속성은 span 태그의 현재 위치를 기준으로 위치를 바꾸는 것이라 이게 왜 아이콘의 중앙에 툴팁을 위치시킬 수 있는지 잘 이해가 되지 않습니다. 추가적인 설명 해주시면 감사하겠습니다!

  • HTML/CSS
  • jquery
hyoseok BANG 댓글 1 좋아요 1 조회수 191

섹션 6-2 알림 내용 중 링크가 잘못되어 있네요.

해결됨

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

안녕하세요 섹션 6. 정적파일 (static files) & 미디어 파일 (media files) - 정적파일 관리하기 - 블로그 포스트 상세 페이지에 부트스트랩 적용하기 을 듣고 있습니다. 거기서 1:31 경, Bootstrap 관련 링크가 수정되었다고 알림이 뜨는데, 그 링크가 잘못되어있습니다. 그 링크를 이용하면, post list 를 카피하게 됩니다. Post detail을 이용하기 위해서는 아래 링크를 사용해야 합니다. https://github.com/StartBootstrap/startbootstrap-blog-post/tree/18e5cfdfb75bc7b06fbb8b04b7d957e0395fe8cc 확인 후 수정 부탁드립니다. 감사합니다.

  • HTML/CSS
  • javascript
  • python
  • django
  • bootstrap
  • aws
  • docker
  • tdd
smile.jisoo 댓글 2 좋아요 0 조회수 296

renderGame 함수에 로그를 찍으면 무한루프가 돕니다

미해결

웹게임을 만들며 배우는 인터렉티브웹! JAVASCRIPT

window.requestAnimationFrame 에서 계속 호출을 하고 있어서 그런 것 같은데 스위치를 만들어야 할까요?

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
litzoo 댓글 1 좋아요 0 조회수 304

수리검이 날아가지 않습니다

미해결

웹게임을 만들며 배우는 인터렉티브웹! JAVASCRIPT

const renderGame에서 keyMotion()까지는 작동을 하는데그 이후 forEach부분부터는 작동하지 않는것같습니다, 왜이럴까요?오타도 없고 아무이상없습니다!혹시 window.requestAnimationFrame이 너무 빨라서 bulletComProp foreach가 씹히는걸까요? ㅠㅠ... 코드 보내드립니다 <game.js> const renderGame = () => { hero.keyMotion(); bulletComProp.arr.forEach((arr,i)=>{ arr.moveBullet(); }) window.requestAnimationFrame(renderGame); } <class.js> if(key.keyDown['attack']){ this.el.classList.add('attack'); bulletComProp.arr.push(new Bullet()); } class Bullet { constructor(){ this.parentNode = document.querySelector(".game"); this.el = document.createElement("div"); this.el.className = "hero_bullet"; this.x = 0; this.y = 0; this.speed = 30; this.distance = 0; this.init(); } init(){ this.x = hero.position().left + hero.size().width/2; this.y = hero.position().bottom - hero.size().height/2; this.el.style.transform = `translate(${this.x}px, ${this.y}px)`; this.parentNode.appendChild(this.el); } moveBullet(){ this.distance += this.speed; this.el.style.transform = `translate(${this.distance}px, 100)`; this.el.style.backgroundColor = 'red'; } }

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
litzoo 댓글 1 좋아요 0 조회수 251

안녕하세요 이미지 관련해서 질문이 있습니다,

해결됨

[코드캠프] 강력한 CSS

안녕하세요 현재 이미지 관련해서 제공해주신 가이드 따라 작업 중에 있는데 비율이 다른 이미지 같은 경우 하나의 행에서는 height가 같았으나 flex-wrap 으로 다음 줄로 넘어가면 height가 달라지는지 궁금합니다. 반응형 제작 중에 있는데 desktop 미디어 쿼리에서 한 줄에 두 개의 이미지 아이템이 있을 경우 height는 같은데 mobile 미디어 쿼리에서 한 줄에 하나의 이미지만 디스플레이 하고자 할 때 height값이 달라져 이것저것 찾아보고 하루 통으로 날리고 질문드려 봅니다.....ㅠㅠ 혹싀...이미지 원본 비율과도 관련이 있을까요....

  • HTML/CSS
채범석 댓글 1 좋아요 0 조회수 388

인기 태그

인프런 TOP Writers

주간 인기글