inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

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

모던 HTML/CSS/VanillaJS+ES6 로 상용화도 가능한 반응형 모던 웹페이지 만들기3

data-position 속성에 관하여 질문이있습니다

430

ohio

작성한 질문수 3

0

안녕하세요 

강의 3분대에 data-position 속성에 관하여 질문이있습니다 

data -position ='0' 으로 지정해놓으셨는데

이해가 잘가지않아서요   (position 속성이 위치에 따라 변한다... 이런느낌인것같은데 ..)

html5    data -  * 속성에 관하여 조금더 자세한 설명 부탁드려도 될까요 ? 

감사합니다  

HTML/CSS javascript es6

답변 2

1

잔재미코딩 DaveLee

안녕하세요.

html 태그는 각 태그마다, 사용할 수 있는 속성이름이 정해져있습니다. 그런데, Javascript 등과 연계해서, 해당 태그에 데이터를 저장하는 기능을 쓰고 싶을 때, data-마음대로이름 의 속성을 정할 수 있다라는 의미입니다. 즉, 태그에 변수를 선언할 수 있다라고 보시면 좋을 것 같고요. 

사실 지금 들으시는 챕터를 다시 들어보신 후에, 이후 후반부를 쭉 보시면 해당 속성을 어떻게 Javascript 에서 쓰고 있는지까지 보여드리기 때문에, 강의 후반부를 들으시면 자연스럽게 이해가 가실 것입니다.

다음 링크도 참고해보시면 좋을 것 같고요.

https://developer.mozilla.org/ko/docs/Learn/HTML/Howto/%EB%8D%B0%EC%9D%B4%ED%84%B0_%EC%86%8D%EC%84%B1_%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

다음 글에서 개발자를 위한 정보 검색 팁 블로그도 읽어보시면 그것도 도움이 되실 것 같습니다.

궁금한 점에 대한 답변 찾기 꿀팁!
궁금한 부분이 있거나, 문제가 있을 때, 항상 google.co.kr 에서 질문에 대해 검색해보세요! (아직까지는 네이버?로 검색하는 개발자는 없습니다.)
에러 메시지는 맨 마지막 라인을 복사해서 구글에서 검색해보시고, 질문에 대해서는 질문 관련 키워드들을 조합해서 구글에서 검색해보세요. 개발자들은 모두 이를 통해, 답변을 얻습니다. 한발짝 나아 가시려면, 반드시 이런 연습이 꼭 필요합니다.
저는 한가지 확인이 필요한 사안을 위해, 20 ~ 30분 검색과 10개 이상의 블로그를 찾아보는 일을 하루에도 한두번씩 한답니다.
검색이 처음이신 분들은 개발자를 위한 정보 검색 팁을 참고하시면 훨씬 성장하시는데 도움이 되실 것입니다.
두번째, 각 강의마다, 다른 분들께서도 이미 질문하신 사항들이 있습니다.
해당 부분을 확인해보시면, 답변을 기다릴 필요 없어서, 훨씬 도움이 되실 것 같습니다.
세번째, 각자 작성하신 코드 에러의 경우는
제가 제공해드린 코드자료를 수정하지 않고, 단계별로 그대로 실행해보신 후, 해당 코드와 자신의 코드가 어떤 부분이 다른지를 단계별로 확인해보시면, 훨씬 좋습니다.
키보드로 그대로 따라 치시기 보다, 제공해드린 코드를 그대로 복사해서 붙여넣고 테스트를 해보시면 좋고, 여기에서 자신의 코드와 다른 부분을 최대한 작게 쪼개서 조금씩 넣어보시면서, 테스트를 해보시면 가장 좋습니다. 각자 코드를 작성하신다면, 이렇게 작업해보시면 훨씬 도움이 되실꺼예요.
마지막으로, 질문하실 경우에는 어느 강의 영상의 어느 구간(가능하다면 몇분 몇초)에 대해 질문하시는 것인지 꼭 명기해주시면 좋습니다.
그래야 맥락이 이해가 가서, 보다 좋은 답변할 수 있습니다. 만약 구간 명기가 가능하지 않다면, 강의 영상 외적인 문의인지에 대해 확인 부탁드립니다. 본 질문 답변란은 강의 영상 이해를 돕기 위한 자리입니다. 강의 영상 외적인 부분은 양해를 부탁드립니다. 특히 극히 일부 개인별 코드 리뷰나 기능 구현등 무리가 되는 요청을 하시는 분들도 계셨는데, 좋은 강의가 선순환될 수 있도록 부탁드립니다.
잔재미코딩 Dave Lee 드림

0

ohio

답변 정말감사드립니다 :) 

교육기간을 연장할 수 있는지 문의드립니다.

0

36

1

메일 확인부탁드립니다

0

56

1

CodeSandbox Vanilla 질문있습니다

0

59

1

part1을 수강하지 않아도 지장이 없다 하셨는데

0

106

1

강의에 관해 문의 드립니다.

0

90

1

메일확인 부탁드립니다.

0

90

1

14강 - 72,73번 강의 영상이 동일한거 같습니다.

0

105

1

Symbol 관련 테스트 코드 실행 결과 문의

0

139

1

호환성 관련 태그

0

119

1

강의화면은 index.js인데 왜 샌드박스코드에서는 index.mjs인지 궁금해요

0

136

1

강의화면은 index.js인데 왜 샌드박스코드에서는 index.mjs인지 궁금해요

0

144

1

div id="highlighter"가 강의화면에는 없는데 왜 샌드박스파일에는 있는지 궁금해요

0

86

1

강의화면에 height 가 vh가 아닌 vw라고 나와있는데 뭐가맞는거죠

0

117

1

메일 확인 부탁드립니다.

0

146

1

메일 확인 부탁드립니다

0

150

1

특별한 형태의 javascript배열에서

0

135

1

메일 확인부탁드립니다!

0

160

1

codesandbox 업데이트..

0

143

1

pdf 파일에 있는 링크주소로 들어가지지가 않습니다.

0

266

2

강의에서 알려주신 Properties for the flex container 복습 사이트, 검색 발견되어서 공유드립니다~

0

151

1

removeEventlistener 를 왜 해주어야 하는지

0

227

1

100vw 관련 질문

0

333

2

VS CODE html:5 <tab>기능이 안됩니다

0

345

1

[모던웹페이지 만들기9](1:40)class-desc 카드부분관련

0

244

2