묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Python 엑셀 프로그래밍 - with xlsxwriter
저장이 특정 폴더가 아니라 여기만 존쟈하는 드라이브로 들어갑니다
엑셀을 저장하는데 제 컴퓨터가 아니라 특정 파일로 들어갑니다
-
미해결파이썬 무료 강의 (기본편) - 6시간 뒤면 나도 개발자
로또 추출기에서 중복되는 수는 어떻게 해야해요?
마지막쯔음에 로또 추첨기 만들 수 있는데 중복을 어떻게 거르죠?
-
해결됨프론트엔드 개발자를 위한 웹팩
.txt 파일 자동생성 관련 질문이 있습니다.
main.js.LICENSE.txt 파일이 자동으로 생성이 됩니다. 라이센스 .txt 파일이 생성되지 않게 설정하는 방법도 있나요?
-
미해결애플 웹사이트 인터랙션 클론!
main.js 를 적용한 후에 show-scene-1에서 2로 넘아기질 않습니다..ㅠㅠ
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="preconnect" href="https://fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;900&display=swap" rel="stylesheet"> <link rel="stylesheet" href="default.css"> <link rel="stylesheet" href="01.css"> </head> <body> <div class="container"> <nav class="global-nav"> <div class="global-nav-links"> <a href="#" class="global-nav-item">Rooms</a> <a href="#" class="global-nav-item">Ideas</a> <a href="#" class="global-nav-item">Stores</a> <a href="#" class="global-nav-item">Contact</a> </div> </nav> <nav class="local-nav"> <div class="local-nav-links"> <a href="#" class="product-name">AirMug Pro</a> <a href="#" class="local-nav-item">개요</a> <a href="#" class="local-nav-item">제품사양</a> <a href="#" class="local-nav-item">구입하기</a> </div> </nav> <section class="scroll-section" id="scroll-section-0"> <h1>AirMug Pro</h1> <div class="sticky-elem main-message a"> <p>온전히 빠져들게 하는<br>최고급 세라믹</p> </div> <div class="sticky-elem main-message b"> <p>주변 맛을 느끼게 해주는<br>주변 맛 허용 모드</p> </div> <div class="sticky-elem main-message c"> <p>온종일 편안한<br>맞춤형 손잡이</p> </div> <div class="sticky-elem main-message d"> <p>새롭게 입가를<br>찾아온 매혹</p> </div> </section> <section class="scroll-section" id="scroll-section-1"> <p class="description"> <strong >보통 스크롤 영역</strong> Lorem ipsum dolor sit amet consectetur adipisicing elit. Blanditiis optio quasi maxime quam dolore sequi, beatae non qui dolorum magni aspernatur. Temporibus id debitis accusantium non porro. Veritatis, magnam saepe. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Nobis, debitis vero aliquam facilis soluta, facere, quis magnam ex deleniti dicta reprehenderit ad necessitatibus veritatis quas repellendus nemo tempore molestiae dignissimos. </p> </section> <section class="scroll-section" id="scroll-section-2"> <div class="sticky-elem main-message a"> <p> <small>편안한 촉감</small> 입과 하나되다 </p> </div> <div class="sticky-elem desc-message b"> <p> 편안한 목넘김을 완성하는 디테일한 여러 구성 요소들, 우리는 이를 하나하나 새롭게 살피고 재구성하는 과정을 거쳐 새로운 수준의 머그, AirMug Pro를 만들었습니다. 입에 뭔가 댔다는 감각은 어느새 사라지고 오롯이 당신과 음료만 남게 되죠. </p> <div class="pin"></div> </div> <div class="sticky-elem desc-message c"> <p> 디자인 앤 퀄리티 오브 스웨덴,<br>메이드 인 차이나 </p> <div class="pin"></div> </div> </section> <section class="scroll-section" id="scroll-section-3"> <p class="mid-message"> <strong>Retina 머그</strong><br> 아이디어를 광활하게 펼칠<br> 아름답고 부드러운 음료 공간. </p> <p class="canvas-caption"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Assumenda natus totam molestias sequi possimus ducimus nisi id. Odit, mollitia consequuntur voluptatum eius doloremque, aperiam, porro tenetur officiis ex illum nisi! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Dolorum ducimus nemo harum iusto consequatur, ipsam necessitatibus nulla, tempora nobis, nam sunt nostrum accusantium atque. Itaque quas veniam eum molestiae nesciunt! </p> </section> <footer class="footer"> 2020, 최태호 </footer> </div> <script src="js/01.js"></script> </body> </html> (()=> { let yOffset = 0; //window.pageYOffset 대신 쓸 변수 let prevScrollHeight = 0; //현재 스크롤 위치(yoffset)보다 이전에 위치한 스크롤 섹션들의 스크롤 높이값의 합 let currentScene = 0; //현재 활성된(눈앞에 보고 있는)씬(scroll-section) let enterNewScene = false; //새로운 씬이 시작된 순간 트루로 바뀔 예정 const sceneInfo = [ { //0 type: 'sticky', heightNum: 5, //브라우저 높이의 5배로 scrollHeight를 세팅(디바이스의 높이의 5배를 하기 위해 설정) scrollHeight: 0, objs: { container: document.querySelector("#scroll-section-0"), messageA: document.querySelector('#scroll-section-0 .main-message.a'), messageB: document.querySelector('#scroll-section-0 .main-message.b'), messageC: document.querySelector('#scroll-section-0 .main-message.c'), messageD: document.querySelector('#scroll-section-0 .main-message.d'), }, values: { messageA_opacity_in: [0, 1, { start: 0.1, end: 0.2 }], messageB_opacity_in: [0, 1, { start: 0.3, end: 0.4 }], messageC_opacity_in: [0, 1, { start: 0.5, end: 0.6 }], messageD_opacity_in: [0, 1, { start: 0.7, end: 0.8 }], messageA_translateY_in: [20, 0, { start: 0.1, end: 0.2 }], messageB_translateY_in: [20, 0, { start: 0.3, end: 0.4 }], messageC_translateY_in: [20, 0, { start: 0.5, end: 0.6 }], messageD_translateY_in: [20, 0, { start: 0.7, end: 0.8 }], messageA_opacity_out: [1, 0, { start: 0.25, end: 0.3 }], messageB_opacity_out: [1, 0, { start: 0.45, end: 0.5 }], messageC_opacity_out: [1, 0, { start: 0.65, end: 0.7 }], messageD_opacity_out: [1, 0, { start: 0.85, end: 0.9 }], messageA_translateY_out: [0, -20, { start: 0.25, end: 0.3 }], messageB_translateY_out: [0, -20, { start: 0.45, end: 0.5 }], messageC_translateY_out: [0, -20, { start: 0.65, end: 0.7 }], messageD_translateY_out: [0, -20, { start: 0.85, end: 0.9 }] } }, { //1 type: 'normal', heightNum: 5, scrollHeight: 0, objs: { container: document.querySelector("#scroll-section-1"), content: document.querySelector('#scroll-section-1 .description') } }, { //2 type: 'sticky', heightNum: 5, scrollHeight: 0, objs: { container: document.querySelector('#scroll-section-2'), messageA: document.querySelector('#scroll-section-2 .a'), messageB: document.querySelector('#scroll-section-2 .b'), messageC: document.querySelector('#scroll-section-2 .c'), pinB: document.querySelector('#scroll-section-2 .b .pin'), pinC: document.querySelector('#scroll-section-2 .c .pin') }, values: { messageA_translateY_in: [20, 0, { start: 0.15, end: 0.2 }], messageB_translateY_in: [30, 0, { start: 0.6, end: 0.65 }], messageC_translateY_in: [30, 0, { start: 0.87, end: 0.92 }], messageA_opacity_in: [0, 1, { start: 0.25, end: 0.3 }], messageB_opacity_in: [0, 1, { start: 0.6, end: 0.65 }], messageC_opacity_in: [0, 1, { start: 0.87, end: 0.92 }], messageA_translateY_out: [0, -20, { start: 0.4, end: 0.45 }], messageB_translateY_out: [0, -20, { start: 0.68, end: 0.73 }], messageC_translateY_out: [0, -20, { start: 0.95, end: 1 }], messageA_opacity_out: [1, 0, { start: 0.4, end: 0.45 }], messageB_opacity_out: [1, 0, { start: 0.68, end: 0.73 }], messageC_opacity_out: [1, 0, { start: 0.95, end: 1 }], pinB_scaleY: [0.5, 1, { start: 0.6, end: 0.65 }], pinC_scaleY: [0.5, 1, { start: 0.87, end: 0.92 }] } }, { //3 type: 'sticky', heightNum: 5, scrollHeight: 0, objs: { container: document.querySelector("#scroll-section-3") } } ]; function setLayout() { // 각 스크롤 섹션의 높이 세팅 for (let i=0; i< sceneInfo.length; i++){ if (sceneInfo[i].type === "sticky") { sceneInfo[i].scrollHeight = sceneInfo[i].heightNum * window.innerHeight; } else if (sceneInfo[i].type === "normal") { sceneInfo[i].scrollHeight = sceneInfo[i].objs.container.yOffsetHeight + window.innerHeight * 0.5; } sceneInfo[i].objs.container.style.height = `${sceneInfo[i].scrollHeight}px`; } yOffset = window.pageYOffset; let totalScrollHeight = 0; for (let i = 0; i < sceneInfo.length; i++) { totalScrollHeight += sceneInfo[i].scrollHeight; if (totalScrollHeight >= yOffset) { currentScene = i; break; } } document.body.setAttribute('id', `show-scene-${currentScene}`); } function calcValues (values, currentYOffset) { let rv; // 현재 씬(스크롤섹션)에서 스크롤된 범위를 비율로 구하기 const scrollHeight = sceneInfo[currentScene].scrollHeight; const scrollRatio = currentYOffset / sceneInfo[currentScene].scrollHeight; if (values.length === 3) { // start ~ end 사이에 애니메이션 실행 const partScrollStart = values[2].start * scrollHeight; const partScrollEnd = values[2].end * scrollHeight; const partScrollHeight = partScrollEnd - partScrollStart; if (currentYOffset >= partScrollStart && currentYOffset <= partScrollEnd) { rv = (currentYOffset - partScrollStart) / partScrollHeight * (values[1] - values[0]) + values[0]; } else if (currentYOffset < partScrollStart){ rv = values[0]; } else if (currentYOffset > partScrollEnd) { rv = values[1]; } } else { rv = scrollRatio * (values[1] - values[0]) + values[0]; } console.log(rv) return rv; } function playAnimation() { const objs = sceneInfo[currentScene].objs; const values = sceneInfo[currentScene].values; const currentYOffset = yOffset- prevScrollHeight; const scrollHeight = sceneInfo[currentScene].scrollHeight; const scrollRatio = currentYOffset / scrollHeight; switch (currentScene) { case 0: if (scrollRatio <= 0.22) { // in objs.messageA.style.opacity = calcValues(values.messageA_opacity_in, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageA.style.opacity = calcValues(values.messageA_opacity_out, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.42) { // in objs.messageB.style.opacity = calcValues(values.messageB_opacity_in, currentYOffset); objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageB.style.opacity = calcValues(values.messageB_opacity_out, currentYOffset); objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.62) { // in objs.messageC.style.opacity = calcValues(values.messageC_opacity_in, currentYOffset); objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageC.style.opacity = calcValues(values.messageC_opacity_out, currentYOffset); objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.82) { // in objs.messageD.style.opacity = calcValues(values.messageD_opacity_in, currentYOffset); objs.messageD.style.transform = `translate3d(0, ${calcValues(values.messageD_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageD.style.opacity = calcValues(values.messageD_opacity_out, currentYOffset); objs.messageD.style.transform = `translate3d(0, ${calcValues(values.messageD_translateY_out, currentYOffset)}%, 0)`; } break; case 1: // let messageA_opacity_in = calcValues(values.messageA_opacity, currentYOffset); // objs.messageA.style.opacity = messageA_opacity_in; break; case 2: // console.log("2 play"); if (scrollRatio <= 0.32) { // in objs.messageA.style.opacity = calcValues(values.messageA_opacity_in, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageA.style.opacity = calcValues(values.messageA_opacity_out, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.67) { // in objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_in, currentYOffset)}%, 0)`; objs.messageB.style.opacity = calcValues(values.messageB_opacity_in, currentYOffset); objs.pinB.style.transform = `scaleY(${calcValues(values.pinB_scaleY, currentYOffset)})`; } else { // out objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_out, currentYOffset)}%, 0)`; objs.messageB.style.opacity = calcValues(values.messageB_opacity_out, currentYOffset); objs.pinB.style.transform = `scaleY(${calcValues(values.pinB_scaleY, currentYOffset)})`; } if (scrollRatio <= 0.93) { // in objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_in, currentYOffset)}%, 0)`; objs.messageC.style.opacity = calcValues(values.messageC_opacity_in, currentYOffset); objs.pinC.style.transform = `scaleY(${calcValues(values.pinC_scaleY, currentYOffset)})`; } else { // out objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_out, currentYOffset)}%, 0)`; objs.messageC.style.opacity = calcValues(values.messageC_opacity_out, currentYOffset); objs.pinC.style.transform = `scaleY(${calcValues(values.pinC_scaleY, currentYOffset)})`; } break; case 3: // console.log("3 play"); break; } } function scrollLoop() { //전체 스크롤(타임라인 합)의 누적을 막기 위해 0으로 설정 enterNewScene = false; prevScrollHeight = 0; for(let i=0; i <currentScene; i++){ prevScrollHeight = prevScrollHeight + sceneInfo[i].scrollHeight; } if (yOffset > prevScrollHeight + sceneInfo[currentScene].scrollHeight) { enterNewScene = true; currentScene++; document.body.setAttribute('id', `show-scene-${currentScene}`); } if (yOffset < prevScrollHeight) { enterNewScene = true; if (currentScene === 0) return; //브라우저 바운스 효과로 인해 마이너스가 되는 것을 방지(모바일) currentScene--; document.body.setAttribute('id', `show-scene-${currentScene}`); } if (enterNewScene) return; playAnimation(); } window.addEventListener("scroll", () =>{ yOffset= window.pageYOffset; scrollLoop(); }); window.addEventListener('load', setLayout); window.addEventListener('resize', setLayout); })();
-
미해결[개정판] 파이썬 머신러닝 완벽 가이드
경고 문구 질문드려요
안녕하세요 보스턴 주택가격 예측 실습을 하던 중에 자꾸만 경고문이 떠서 질문드렸습니다. 실습대로 LinearRegression, Ridge, Lasso의 RMSE 값 리스트와 평균 RMSE를 구했을 뿐인데 자꾸 저런 경고문이 뜨네요. 저게 뭘 의미하는 것인지, 그리고 어떻게하면 해결할 수 있을까요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
model에서 Comment.Find를 할때 궁금한것이 있습니다.
Comment.find({'_id':comment._id}) .populate('writer') .exec((err,result)=>{ if(err) return res.json({seccess:false,err}) res.status(200).json({success:true,result}); }) 파라미터로 _id를 보냈는데, 이는 writer의 User에 대한 _id 인지 궁금합니다. Comment 모델 자체의 필드값은 _id를 받을수 있는게 없어 보여서, 저 뜻이 writer에 대한 _id 정보를 가져온다는 뜻으로 봐야할까요?
-
미해결파이썬 무료 강의 (기본편) - 6시간 뒤면 나도 개발자
" n ", ' n ' 차이점이 뭔가요
큰 따음표와 작은 따음표 차이점이 뭔가요?
-
미해결따라하면서 배우는 고박사의 유니티 기초
설치에러
유니티 허브에서 유니티 설치하는데 용량 큰 외장하드로 경로를 설정했음에도 불구하고 계속용량이 부족하다고 하오네요... 이유가 무엇인지 알고 싶습니다...
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
useSelector로 가져온 state 값을 변경하고 싶습니다.
현재 이메일 중복 체크를 구현 하고 있습니다. const onChangeEmailInput = useCallback((evt) => { setEmailInput(evt.target.value); const regExp = /^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/; if (!regExp.test(evt.target.value)) { setEmailVerify('이메일 형식에 맞게 입력을 해주세요.'); } else { dispatch({ type: CHECK_OVERLAP_EMAIL_REQUEST, data: evt.target.value, }); } }, [emailInput, emailVerify]); input이 변경될 때 이메일 정규식에 통과되면 중복된 이메일을 찾는 액션이 실행되고 router에서 router.get('/check_overlap_email', (req, res, next) => { try { const query = `SELECT email FROM TB_USER WHERE email = '${req.query.data}'`; connection.query(query, (err, result) => { if (err) throw err; if (result[0]) { res.status(200).send('exists'); } else { res.status(200).send('available'); } }); } catch (err) { console.error(err); next(err); } }); 이런식으로 값이 있으면 exists, 없으면 available로 값을 받습니다. 받은 값으로 useEffect(() => { console.log(checkOverLapEmailResult); if (checkOverLapEmailResult !== null) { if (checkOverLapEmailResult === 'exists') { setEmailVerify('이미 가입된 이메일입니다.'); } else { setEmailVerify(true); } } }, [checkOverLapEmailResult]); useEffect를 통해 체크를 해주는데 문제는 아래 flow일 때 문제가 됩니다. 1. 정규식 통과를 한 뒤 중복체크를 했는데 이메일이 없어서 available값을 받음. 2. 그 다음 이메일을 다 지워서 정규식을 통과하지 못해 '이메일 형식에 맞게 입력을 해주세요'가 출력. 3. 다시 정상적인 이메일을 입력후에 available값을 받음. 이 flow 대로 진행했을 때 checkOverLapEmailResult state가 available로 동일하여 useEffect에 들어오지 못하여 setEmailVerify(true); 코드가 실행이 되지 않아 emailVerify가 변경되지 않습니다. 그래서 정규식에 통과를 하지 못할 때 useSelector로 가져온 checkOverLapEmailResult state 값을 null로 초기화를하고 싶은데 어떤 방법이 효율적인지 궁금합니다. 제가 생각한거는 RESET_OVERLAP_EMAIL_STATE라는 액션을 하나 만들어서 정규식에 통과하지 못할 때 마다 호출하여 값을 초기화 하는 방법을 생각하고 있는데, 괜찮은지 궁금합니다.
-
미해결업무 자동화를 위한 파이썬 pyautogui, beautifulsoup 크롤링 기초
크롤링 할때 sh_blog_title 형식으로 안나오는데요! ㅠ
f12를 누르고 블로그 창을 봐도 'api_text_lines'으로 나오는데 아무리 찾아도 sh_blog_title 형식으로 안나오네요! ㅠ
-
미해결[직딩꿀템] 나도 금손! 지나가던 팀장도 돌아보는 PPT 디자인
학습에 필요한 실습파일은 별도로 제공되지 않는지요?
동영상을 보고 따라할려고 하는데, 기본적인 실습파일이 제공되는 문의드립니다.
-
미해결따라하며 배우는 도커와 CI환경 [2023.11 업데이트]
aws 배포 오류가뜨네요
코딩 다 검사하구 테스트도 잘 통과됬는데두 aws에서 배포 오류가뜨네요 ㅜㅜ
-
미해결HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
구글 웹폰트
안녕하세요 선생님 강의 초반에 Google web Font 하고 @important url(도메인주소) 가 있는데 이건 무슨 뜻인가요? 안배우운 부분인거같아서 여쭤봅니다 !
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
이메일로 문의 드렸는데요 아직 답변없어서 이곳에 질문을 남깁니다. 한글이 깨져요
수업자료를 다운 로드를 받고 압축을 풀었는데요 첨부 파일을 보니 섹션 1-10 까지는 한글이 보이지만 나머지는 한글이 깨져서 나옵니다. 문제 풀이를 하려고 하는데요 파일을 찾기가 너무 어렵습니다. 파일 이름저장 할때 모두다 유니코드로 해주셨으면 합니다. 참고로 저는 맥 사용자 입니다.
-
해결됨파이썬 알고리즘 문제풀이 입문(코딩테스트 대비)
n = 1인 경우에 대하여
n = 1이면 자기 자신을 선택해서 결과가 1이 나와야할거 같은데 0이 나옵니다. res = 1로 초기화하면 될까용?
-
미해결[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
블라켓위에 아이콘표시는 어떻게하나요?
선생님보시면 html / css / js 별로 위에보시면 각 기능에맞게 아이콘그림이뜨는데 어떤 익스텐션기능을 사용하시는지 알려주시면 감사하겠습니다!
-
미해결[C#과 유니티로 만드는 MMORPG 게임 개발 시리즈] Part2: 자료구조와 알고리즘
While(true)
안녕하세요. 마지막에 맵을 실제 그리는 코드문을 보면 While(true) { Setposition board.render(); } 로 구현하고 있는데요 , 이때 while(true)면 무한루프가 되어 렌더함수가 계속호출되어 계속 맵을 그리는 상태가 되는것 아닌가 싶습니다. 딱히 루프를 나오게하는 코드는 안보이거든요. 또한 , Board라는 클래스 객체가 사라져도 한번그린 맵은 그대로 유지되는것으로 보이는데 왜 무한루프를 사용한건지 모르겠습니다! 감사합니다
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
nvm 실행이 되지 않아 문의드립니다.
mac 에서 vi ~/.bashrc 파일에 설명해 주신 설정 값을 삽입 후 nvm을 실행해 봤지만 도저히 실행이 되지 않아 문의드립니다. 설정 값을 여러번 확인 했는데도 되지 않네요..ㅠ
-
해결됨[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지
도메인 설정
안녕하세요 도메인 설정하는 방법이 궁금합니다 즉 127.0.0.1:8080처럼이 아니라 예를들어 도메인으로 접속하고싶습니다 node-dev.com:8080처럼요 php는 아파치 설정파일에서 하는데 노드는 어디서 할수있나요?
-
미해결웹브라우저 Javascript (자바스크립트)
jQuery 객체란 --> li.map()
li.map()의 함수에 전달하는 index, elem은 HTMLElement마다 다르겠죠? 일부는 비슷할것 같은데요.. (가령 UL은 LI와 동일할 것으로 생각이됩니다만)
