묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)
비주얼 스튜디오 코드 Bracket Pair Colorizar 설치
비주얼 스튜디오 코드 필수 앱 설치 및 사용법 영상을 보고 있는데'Bracket Pair Colorizar' 이라는 프로그램이 기능 제공을 더 이상 하지 않는다고 적혀있습니다. 해당 프로그램 외에 어떤걸 설치 해야 하나요???
-
미해결퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)
Beautify에 관해서
유튜브 보면서 비주얼 스튜디오 코드 환경설정 중인데 beautify가 '이 확장은 더 이상 유지 관리되지 않으므로 더 이상 사용되지 않습니다.' 라는 알림문 뜹니다그래도 다운 받으면 확장 앱 부분에 노란색 경고 아이콘이 계속 뜨는데 이대로 두는게 맞는건가요?
-
미해결퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)
이미지맵 좌표
HTML 핵심이론 수강중입니다.윈도우의 경우 보조프로그램을 이용하여 이미지 좌표 확인이 가능합니다. 다만, 저는 맥북 유저로 윈도우에서 사용하는 보조프로그램이 없어 이미지 좌표를 확인하는데 조금 문제가 생겼습니다.맥os 에서도 이미지 좌표를 확인하는 방법이 있을까요?
-
미해결퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)
핵심이론 가이드북 폼요소,시멘틱 태그
코딩 초보입니다 핵심이론 가이드북을 참고해서 선생님 유투브를 보면서 공부하고 있어요!코딩 포기하려던 와중에 선생님 강의영상 보고 다른 강의와 다르게 잘 이해할 수 있게 설명해주셔서 포기하지 않고 선생님 강의로 너무 재밌게 공부하고 있는데혹시 폼 요소, 시멘틱 태그 부분은 참고할 수 있는 영상이 없는걸까요??ㅜㅜ유투브에는 표만들기까지만 있네용!
-
미해결HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌3)
순수 CSS 선택자 중첩(Nesting) - 활용예제 (로그인폼)관련 질문있습니다.
scss 작성하다가 궁금한 것이 있어 질문 남깁니다.scss를 작성할 때 띄어쓰기를 어떻게 해야할지 궁금합니다. 예를들어 .status { display: flex; justify-content: space-between; margin: 20px 0; & label { & input[type=checkbox] { display: none; +em { display: inline-block; width: 18px; height: 18px; background-image: url('images/icon-radio.png'); transform: translateY(4px); background-position: left; } &:checked+em { background-position: right; } &:checked+em+span { color: var(--mainColor); } } } & a:hover { text-decoration: underline; } } 선생님과 수업하면서 작성한 띄어쓰기 하지 않은코드인데요.이쁘게 정렬하고 싶어서 alt + shift + f 를 눌러서 전체 정렬을 했더니 .status { display: flex; justify-content: space-between; margin: 20px 0; & label { & input[type=checkbox] { display: none; +em { display: inline-block; width: 18px; height: 18px; background-image: url('images/icon-radio.png'); transform: translateY(4px); background-position: left; } &:checked+em { background-position: right; } &:checked+em+span { color: var(--mainColor); } } } & a:hover { text-decoration: underline; } } 이렇게 자동으로 띄어쓰기게 되더라구요.의미없는 띄어쓰기는 하지 않는게 좋다고 들었는데띄어쓰기를 하지 않으면scss nesting 특성상 괄호가 많아져서 알아보기 힘들고비주얼 단축키로 정렬했을 때엔 알아서 띄어쓰게 해주는데,scss는 어떤식으로 코드를 작성해야할지 궁금합니다.
-
미해결SCSS(SASS)+GRID+FLEX 실전 포트폴리오 퍼블리싱
savePath 경로
scss파일은 scss폴더에 css파일은 css폴더에 따로 컴파일 되게 하고싶어서 이렇게 경로 설정을 하고 저장했는데 css파일이 scss파일하고 동일한 폴더에 컴파일됩니다.
-
미해결CSS Flex와 Grid 제대로 익히기
질문은 아니고.. 오타 발견..
https://studiomeal.com/archives/197위 링크에서 align-items 속성설명 보면"align 키워드가 나왔죠? 수직축 방향으로 아이템을들 정렬하는 속성이에요."라고 오타가 있네요~내용들이 술술 읽혀서 발견했습니다~
-
해결됨SCSS(SASS)+GRID+FLEX 실전 포트폴리오 퍼블리싱
style.scss 만 퍼블리싱 결과물로 전달하면 되는건가요?
선생님 안녕하세요. 강의를 들으면 scss 를 작성하고 watching sass 로 css를 만들어내잖아요.근데 제가 퍼블리싱을 해서 개발자에게 넘겨줄 때도 똑같이 style.scss 와 style.css를 모두 넘겨줘야하는 건가요?아님 style.scss만 넘겨주면 되는 걸까요?(넘 초보적인 질문일수도 있으나 ..^^;;)감사합니다.
-
미해결SCSS(SASS)+GRID+FLEX 실전 포트폴리오 퍼블리싱
pdf 파일 질문이요?
강의중에 pdf 파일 말씀하시는 건 ...pdf 유료 파일로 나와있는 교재를 말씀하시는것이지요? 구입을 안해서...필요하다면 해야할까요?
-
미해결플렉스(Flex) 반응형 웹사이트 포트폴리오(The World's Best Cities)
가로스크롤
■ 질문 남기실 때 꼭! 참고해주세요.- 먼저 유사한 질문이 있었는지 검색해주세요.- 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다.- HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요.- 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다. 선생님 안녕하세요pc, 모바일 반응형은 대응이 됐는데,웹사이트 창을 1250px정도로만 줄여도가로스크롤이 발생을 해서요ㅠㅠ 혹시 이런 경우에는,div와 이미지 크기를 80%같은 수치로 줄여야하는건지?아니면 overflow로 대응을 해야하는건지?궁금합니다. 혹시 몰라서 제가 임의로img에max-width:100%height:auto로 해놨는데 이미지가 안넘어가고 가로스크롤이 발생해서요ㅠㅠ답변주시면 감사합니다. 다른 질문들을 확인해보니,@media (min-width: 768px) and (max-width: 1024px)이런식으로 대응하라고 하셨는데폰트사이즈와 이미지를 줄여야하는건가요?ㅠㅠㅠ아니면 flex구조를 컬럼으로 바꿔야할까요?
-
미해결퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)
임시이미지 사이트 close
HTML 교재 19 페이지 http://placehold.it 열리지 않아요, 없어진것 같음 다른 사이트 알려주세요 그리고 13페이지 한글입숨 사이트 열리지 않아요, 일시적인지 는 몰라도 찾아보니http://guny.kr/stuff/klorem/여기 지원되네요
-
미해결CSS Flex와 Grid 제대로 익히기
px, em ,rem을 어떻게 감각적으로 쓸 수 있을까요?
백엔드 지망생입니다. 개인프로젝트 겸 기본적인 css 지식은 있어야 할 것 같아서 하고 공부하고 있는데, 아직 px와 em rem을 언제 어떻게 써야 할지 잘 모르겠네요..px em rem의 개념은 잘 알고 있지만 강사님꼐서 어떤 상황에선 px을 쓰시고 em을 쓰시고 rem을 쓰시는데 초보자 입장에서 잘 와닿지 않네요.. 3:42초에 search-form input[type='search']에만 보더라도 한 클래스 안에 3개의 px em rem이 써 있는데 이런 감각적인 것을 어떻게 연습하면 좋을까요? 레이아웃 크기 지정도 그렇지만 또 font크기도 px em rem을 따로 쓰던데 이것도 감을 못잡겟네요..
-
미해결CSS Flex와 Grid 제대로 익히기
강의에 나오는 html 자동으로 만들어주는 편집기에 대해 알 수 있을까요?
css 셀렉터 처럼 쓰면 예를 들어ul.menu하면 자동으로 html 완성되는 기능입니다.html 작성이 매우 편한거 같아서요!가르쳐주시면 감사하겠습니다.
-
미해결SCSS(SASS)+GRID+FLEX 실전 포트폴리오 퍼블리싱
모달창에서 반응형 보여주기
안녕하세요 선생님.혹시 Modal 창으로 포트폴리오를 보여 줄 시, 창크기를 줄여서 반응형이 구현된다는 걸 보여 줄 수 있는 방법이 있을까요? (모달창의 창크기가 조절이 되게끔 하는 방법)수업시간에 지나갔는지 기억이 잘 안나네요 ㅎㅎ; 혹시나 불가능하다면, 어쩔 수 없이 링크버튼이 연결된 버튼을 따로 주는 방법이 좋을까요? 항상 감사드립니다.
-
해결됨CSS Flex와 Grid 제대로 익히기
flex-basis auto, 0 차이
flex-basis에서 auto로 설정하는 것과 0으로 설정하는 것의 차이가 무엇인지 궁금합니다.따로 코드를 짜서 실행하면 autof로 설정했을 때와 0으로 설정했을 때 결과물이 똑같아서 차이가 궁금합니다.
-
미해결플렉스(Flex) 반응형 웹사이트 포트폴리오(The World's Best Cities)
상위 태그 영역 무시 하는 방법
<div className="할아버지"> <div className="아버지"> <div className="본인"></div> </div> </div>;분명 이 강의 어디에서 배웠는데 기억이 안나서 질문을 올립니다.classname="본인"이 아버지의 영역을 무시하고할아버지의 영역을 기준으로 본인의 영역을 설정하는 방법이 있었는데요 기억이 안나네요분명 아버지 class에 어떤 css 속성을 설정을 해주면 아버지의 영역을 무시할 수 있었던 것으로 기억을 하는데 도움 부탁드립니다!
-
미해결SCSS(SASS)+GRID+FLEX 실전 포트폴리오 퍼블리싱
선생님 sass 환경설정 화면이 선생님과 달라요
선생님 강의 자세하게 설명해주셔서 너무 잘 듣고있습니다.Sass 환경설정 후 선생님처럼 동일한 코드를 붙여넣으면"liveSassCompile.settings.generateMap": false, "liveSassCompile.settings.formats":[ // This is Default. { "format": "expanded", "extensionName": ".css", "savePath": "/css" } ], "liveSassCompile.settings.autoprefix": [], "liveSassCompile.settings.excludeList": [ "**/node_modules/**", ".vscode/**", ], "liveSassCompile.settings.includeItems": [ ], }저는 이런 에러가 떠요.아무리 구글링을 해도 다들 셋팅 방법만 나와있고 이런 설명이 없어서요..샘 답변 부탁드립니다.
-
미해결CSS Flex와 Grid 제대로 익히기
padding 대신 gap을 쓰는게 더 편하지 않나요?
안녕하세요!강의 재밌게 수강하고 있습니다 :)해당 카드 리스트를 만들 때는 padding보다 gap을 쓰면 더 간단하게 만들 수 있지 않나요??왜 padding을 쓰신 건지 궁금합니다!
-
미해결CSS 레이아웃 - flex & grid
flex-box 하위 요소 아이템들은 자동적으로 높이값 flex-box 높이값과 같아진다고했는데,
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.안녕하세요 강의를 듣던중 flex-box 안에 있는 하위 요소들이 자동적으로 flex-box 높이 값을 먹는다고 했는데 실제로, <ul class="container"> <li class="item">호랑이</li> <li class="item">고양이</li> <li class="item">냥냥이</li> <li class="item">강아지</li> <li class="item">고슴도치</li> </ul> .container { display : flex} 적용했을경우 li 태그들이 container 와 높이가 같은걸 확인 할 수있었습니다. 그런데 왜 <div class="container"> <div class="item">호랑이</li> <div class="item">고양이</li> <div class="item">냥냥이</li> <div class="item">강아지</li> <div class="item">고슴도치</li> </div>인경우 container 하위 요소 div 들은 자신의 높이값을 유지하나요 ?
-
해결됨플렉스(Flex) 반응형 웹사이트 포트폴리오(The World's Best Cities)
반응형 적응형 구분
안녕하세요 선생님!플렉스 강의 너무 잘 듣고 있습니다.최근 플렉스 강의를 중반부 이상듣고 다른 사이트들 브라우저 검사로 스타일시트 염탐? 하고 있는데 궁금한점이 생겨서 문의드립니다.인프런 메인화면의 경우 브라우저 가로 사이즈를 줄이면 반응형으로 컨텐츠 영역이 크기에 맞게 줄어드는데크몽, 당근마켓 메인화면의 경우 브라우저 가로 사이즈를 줄이면컨텐츠 1200px 영역 양옆 마진만 줄어들면서 모바일 태블릿 영역까지 가면 가로스크롤이 길게 생기는데요...요런 사이트들은 브라우저 검사-> 토글디바이스툴바 로 아이폰12pro 선택하고 새로고침을 해야 모바일 레이아웃이 나오고 있는데해당 사이트들은 반응형 사이트가 아닌건가요? 적응형 웹 사이트의 경우 카카오뱅크, 다방 으로 pc, mobile 따로 사이트가 있는 적응형 사이트로 알고 있습니다.(실제로 위에 토글디바이스툴바 방식으로 새로고침 하면 m.***.com || ***.com/mobile)크몽, 당근마켓이 적응형일 경우 주소가 변경되야 될꺼 같은데 주소 변동이 없어서 더 궁금합니다;;제가 잘못 이해하고 있을 수도 있습니다.ㅠ답변 부탁드립니다. 감사합니다.