질문 & 답변 - 인프런 | 커뮤니티

묻고 답해요

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

인프런 TOP Writers

미해결
쉽게 배우고, 포트폴리오로 만드는 반응형 웹! #설화수

999px 풋터에 '한국어' 떄문에 풋터가 길어졌어요

안녕하세요? 쌤~ 마지막 질문좀 드릴께용~ ^^; 999px에서 풋터부분 하단에 한국어 footer_lang 부분이 클릭하면 보여지는데 그것떄문에 클릭 안해도 풋터하단이 길게 남아 있아요..보통 이렇게 하단을 길게 냅두는지 아니면 누르기전에는 하단이 짧게 잇어야할거 같은데요. 사라지게 숨겨놔도 잘안되서요. 하단 랭귀지 선택은 어떻게 만들어야 하나요? 그리고 한국어 클릭하면 오른쪽으로 한국어 글자가 밀리고 select_lang_list 안에 폰트사이즈가 작게 안먹히는데 왜 그럴까요? ㅜㅜ 감사합니다~수고하세용!! 아래 코드입니다.^^ <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>설화수, 아시아의 지혜가 담긴 홀리스틱 뷰티 | 설화수 한국</title> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimal-ui">  <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">  <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="wrap">  <header class="header"> <div class="header_wrap">  <a href="#" class="mob_nav_btn"> <i></i> </a>  <div class="mob_nav"> <div class="bg"></div>  <div class="mob_nav_wrap"> <h2 class="sidenav-h"> <a href="#"></a> <img src="./img/logo_sulwhasoo_m.png" alt=""> </h2> <ul class="m_nav_list"> <li> <a href="#">브랜드스토리 <i class="icon_nav"></i> </a> </li> <li> <a href="#" class="m_nav_tit">제품 <i class="icon_nav"></i> </a> <dl> <dt class="blind">제품</dt> <dd><a href="#">신제품</a></dd> <dd><a href="#">베스트셀러</a></dd> <dd><a href="#">스킨케어</a></dd> <dd><a href="#">메이크업</a></dd> <dd><a href="#">진설</a></dd> <dd><a href="#">명작 컬렉션</a></dd> <dd><a href="#">남성</a></dd> <dd><a href="#">라이프스타일</a></dd> </dl> </li> <li> <a href="#" class="m_nav_tit">설화수 라운지 <i class="icon_nav"></i> </a> <dl> <dt class="blind">설화수라운지</dt> <dd><a href="#">설화수 스타일</a></dd> <dd><a href="#">뷰티리추얼</a></dd> <dd><a href="#">아카이브</a></dd> <dd><a href="#">설화문화전</a></dd> <dd><a href="#">매거진</a></dd> <dd><a href="#">소식</a></dd> </dl> </li> <li> <a href="#"class="m_nav_tit">소개 <i class="icon_nav"></i> </a> <dl> <dt class="blind">소개</dt> <dd><a href="#">소개</a></dd> <dd><a href="#">스파프로그램</a></dd> <dd><a href="#">예약</a></dd> <dd><a href="#">매장찾기</a></dd> </dl> </li> <li> <a href="#"class="m_nav_tit">플래그십 스토어</a> <dl> <dt class="blind">플래그십 스토어</dt> <dd><a href="#">소개</a></dd> <dd><a href="#">리미티드에디션</a></dd> <dd><a href="#">스페셜 서비스</a></dd> <dd><a href="#">예약</a></dd> <dd><a href="#">소식</a></dd> </dl> </li> </ul>  <div class="m_nav_btm"> <div class="m_nav_cp"> <p> <a href="#">회사소개</a> <a href="#">서비스이용약관</a> <a href="#">UGC이용약관</a> <a href="#">개인정보처리방침 </a> <a href="#">영상정보처리방침</a> <a href="#">사이트맵</a> <a href="#">로그인</a> <a href="#">회원가입</a> </p> <div class="m_nav_cs"> 고객서비스센터(수신자요금부담) 080-023-5454<br> 월~금: AM 09:00~PM 06:00 </div> <div class="m_copy"> © AMOREPACIFIC CORPORATION. All rights reserved. </div> <a href="#"><img src="img/wa.png" alt="wa"></a> </div> </div> </div> </div>  <div class="select_language"> <a href="#" class="t_lang"> 한국/한국어 <i class="icon-angle-up"></i> <i class="icon-angle-down"></i> </a> <ul class="select_lang_list"> <li> <a href="#">한국/한국어</a> </li> <li> <a href="#">International/English</a> </li> <li> <a href="#">中国大陆/中文</a> </li> <li> <a href="#">中國香港/繁體中文</a> </li> <li> <a href="#">Hong Kong(China)/English</a> </li> <li> <a href="#">Singapore/English</a> </li> <li> <a href="#">Malaysia/English</a> </li> <li> <a href="#">Việt Nam/Tiếng Việt</a> </li> <li> <a href="#">Indonesia/Bahasa Indonesia</a> </li> <li> <a href="#">ประเทศไทย/ไทย</a> </li> <li> <a href="#">USA/English</a> </li> <li> <a href="#">FRANCE/FRANCAIS</a> </li> </ul> </div> <h1 class="logo"> <a href="#"><img src="img/logo_sulwhasoo.png" alt="logo"> </a> </h1> <div class="header_link"> <a href="#">매장찾기</a> <a href="#">구매하기</a> <a href="#" class="h_open_search"><i class="icon-search"></i> </a> <div class="search_container "> <form action="sarch.jsp"> <div class="search_wrap"> <label for="q" class=blind></label> <input type="search" id="q" class="text"> <button class="submit"> <i class="icon-search"></i> </button> </div> <a href="#" class="sch_close"> <img src="img/bu_x.png" alt="검색창닫기"> </a> </form> </div> </div> </div>  <div class="gnb "> <div class="header_wrap"> <ul class="gnb_menu"> <li class="nav_d1"> <a href="#" class="nav_d1_a">브랜드스토리</a> </li> <li class="nav_d1 d1_Over "> <a href="#" class="nav_d1_a">제품</a> <ul> <li class="nav_d2_box"> <a href="#" class="nav_d2_a"> 신제품 </a> <a href="#" class="nav_d2_a">베스트셀러</a> <a href="#" class="nav_d2_a">스킨케어 </a> <a href="#" class="nav_d2_a">메이크업</a> <a href="#" class="nav_d2_a">진설명작</a> <a href="#" class="nav_d2_a">명작컬렉션 </a> <a href="#" class="nav_d2_a">남성</a> <a href="#" class="nav_d2_a"> 라이프스타일</a> <a href="#" class="nav_d2_a"> 전제품 구성 </a> <a href="#" class="nav_d2_a"> 신제품 </a> </li> </ul> </li> <li class="nav_d1 d1_Over"> <a href="#" class="nav_d1_a"> 설화수 라운지 </a> <ul> <li class="nav_d2_box"> <a href="#" class="nav_d2_a">설화수 스타일</a> <a href="#" class="nav_d2_a">뷰티리추얼</a> <a href="#" class="nav_d2_a">설화문화전</a> <a href="#" class="nav_d2_a">매거진</a> <a href="#" class="nav_d2_a">소식</a> </li> </ul> </li> <li class="nav_d1 d1_Over"> <a href="#" class="nav_d1_a"> 스파 </a> <ul> <li class="nav_d2_box"> <a href="#" class="nav_d2_a">소개</a> <a href="#" class="nav_d2_a">스파프로그램 </a> <a href="#" class="nav_d2_a">예약찾기</a> <a href="#" class="nav_d2_a">매장찾기</a> </li> </ul> </li> <li class="nav_d1 d1_Over"> <a href="#" class="nav_d1_a"> 플래그십 스토어 </a> <ul> <li class="nav_d2_box"> <a href="#" class="nav_d2_a">소개</a> <a href="#" class="nav_d2_a">리미티드 컬렉션</a> <a href="#" class="nav_d2_a">스페셜서비스</a> <a href="#" class="nav_d2_a">예약</a> <a href="#" class="nav_d2_a">소식</a> </li> </ul> </li> </ul> </div> </div> </header>  <div class="sub_menu"> <ul> <li></li> </ul> </div> <div id="main">  <div class="visual"> <button class="right visu_arrow">right</button> <button class="left visu_arrow">left</button> <ul class="visu_btm_wrap"> <li class="visu_btm_list"><a href="#">btn01</a></li> <li class="visu_btm_list"><a href="#">btn02</a></li> <li class="visu_btm_list"><a href="#">btn03</a></li> <li class="controls_wrap"> <button class="start control">start</button> <button class="stop control">stop</button> </li> </ul>  <ul class="visual_wrap"> <li class="visu_slide"> <div class="visu_veil"></div> <div class="visu_txt_wrap"> <div class="visu_txt_cont"> <div class="visu_tit"> 자음생에센스 </div> <div class="visu_txt_sub01"> Concentrated Ginseng Renewing Serum </div> <p class="visu_txt_sub02"> 진세노믹스™가 선사하는 <br> 3중 마이크로타켓팅으로 <br> 쉽게 무너지지 않는 탄탄한 피부 </p> <div class="visu_btn_wrap"> <a href="#" class="btn_view">자세히보기</a> <a href="#" class="btn_view">구매하러가기</a> </div> </div> </div> </li> <li class="visu_slide"> <div class="visu_veil"></div> <div class="visu_txt_wrap" > <div class="visu_txt_cont"> <div class="visu_tit"> 자음생앰플 </div> <div class="visu_txt_sub01"> Concentrated Ginseng Rescue Ampoule </div> <p class="visu_txt_sub02"> 단 한 번 사용으로도 외부자극으로 시달린<br> 피부를 개선해주는 레스큐 앰플 </p> <div class="visu_btn_wrap"> <a href="#" class="btn_view">자세히보기</a> </div> </div> </div> </li> <li class="visu_slide"> <div class="visu_veil" ></div> <div class="visu_txt_wrap" > <div class="visu_txt_cont"> <div class="visu_tit"> 윤조에센스 <br> 2020 뉴이어 컬렉션 </div> <div class="visu_txt_sub01"> BEAUTY FROM YOUR CULTURE </div> <p class="visu_txt_sub02"> 온 세상에 복을 전하는 <br> 마술같은 여정 <br> 쉽게 무너지지 않는 탄탄한 피부 </p> <div class="visu_btn_wrap"> <a href="#" class="btn_view">자세히보기</a> </div> </div> </div> </li> </ul> </div>  <div class="content"> <div class="recommend"> <h2 class="cont_title">설화수 선물추천</h2>  <div class="recomm_tab"> <a href="#" class="btn_tab on">TRENDING</a> <a href="#" class="btn_tab">BEST</a> <a href="#" class="btn_tab">NEW</a> </div>  <div class="recomm_list_wrap">  <ul class="recomm_list Act"> <li> <div class="recomm_img"> <img src="./img/recom_01.jpg" alt="01"> </div> <div class="recomm_name"> 윤조에센스 뉴이어 리미티드 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_02.jpg" alt="01"> </div> <div class="recomm_name"> 전설명작크림 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_03.jpg" alt="01"> </div> <div class="recomm_name"> 자음생 2종 기획 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_04.jpg" alt="01"> </div> <div class="recomm_name"> 진설 2종기획 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> </ul>  <ul class="recomm_list"> <li> <div class="recomm_img"> <img src="./img/recom_05.jpg" alt="01"> </div> <div class="recomm_name"> 자음생크림 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_09.jpg" alt="01"> </div> <div class="recomm_name"> 자음생에센스 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_07.jpg" alt="01"> </div> <div class="recomm_name"> 자음생유액 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_08.jpg" alt="01"> </div> <div class="recomm_name"> 자음생크림 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> </ul>  <ul class="recomm_list"> <li> <div class="recomm_img"> <img src="./img/recom_09.jpg" alt="01"> </div> <div class="recomm_name"> 윤조에센스 세포라 리미티드 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_10.jpg" alt="01"> </div> <div class="recomm_name"> 옥용팩 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_11.jpg" alt="01"> </div> <div class="recomm_name"> 여윤팩 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> <li> <div class="recomm_img"> <img src="./img/recom_12.jpg" alt="01"> </div> <div class="recomm_name"> 퍼팩팅 파운데이션 클로우 </div> <div class="buy_view_layer"> <a href="#">자세히보기</a> </div> </li> </ul> </div> </div>   <div class="cont02"> <div class="lounge lou01"> <div class="lounge_cont"> <div class="lounge_img"> <a href="#"> <img src="../img/lou_01.jpg" alt="liu01"> </a> </div> <div class="lounge_txt_wrap"> <h3>SHADE picker</h3> <p class="sub_tit">나에게 맞는 컬러가 궁금하다면?</p> <p class="desc">사용 중인 페이스 메이크업 제품 정보를 통 같은 컬러의 설화수 제품을 찾아드립니다.</p> <div class="btn_wrap"> <a href="#" class="btn_view">자세히보기</a> </div> </div> </div> </div> <div class="lounge lou02"> <div class="lounge_cont"> <div class="lounge_img"> <a href="#"> <img src="./img/lou02.jpg" alt="liu01"> </a> </div> <div class="lounge_txt_wrap"> <h3>뷰티리추얼</h3> <p class="sub_tit">윤조 & 자음생<br> 탄력 시너지 듀오 <p class="desc">설화수 대표 윤조에센스 자음생에센스가 선사하는<br> 감동의 탄력 시너지로 올 여름 탄탄한 피부를 느껴보세요 느껴보세요</p> <div class="btn_wrap"> <a href="#" class="btn_view">자세히보기</a> </div> </div> </div> </div> </div>  <div class="flagship"> <h2 class="cont_title"> 설화수 플래그십 스토어 & 스파 </h2> <div class="flag_wrap"> <ul class="flag_slider"> <li class="fl_01">slider</li> <li class="fl_02">slider</li> <li class="fl_03">slider</li> <li class="fl_04">slider</li> </ul> <ul class="flag_btm_wrap"> <li class="Act"><a href="#">0</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> </ul> <div class="flag_txt_wrap"> <p> 등불이 어둠을 밝혀 길을 안내하 듯, <br> 아시아의 지혜를 담아 아름다움을 비추는<br> 설화수 플래그십 스토어와 스파를 <br> 방문해보세요. </p> <a href="#" class="btn_view"> 자세히보기 </a> </div> <a href="#" class="flagside left">left</a> <a href="#" class="flagside right">right</a> </div> </div> </div> </div> <footer class="footer"> <div class="footer_wrap"> <div class="foot_link"> <div class="link_left"> <div class="foot_item_wrap"> <a href="#" class="footer_item">회사소개</a> <a href="#" class="footer_item">서비스이용약관</a> <a href="#" class="footer_item">UGC이용약관</a> <a href="#" class="footer_item">개인정보처리방침</a> <a href="#" class="footer_item">영상정보처리방침</a> <a href="#" class="footer_item">사이트맵</a> </div> <div class="foot_item_wrap"> <a href="#" class="footer_item">로그인</a> <a href="#" class="footer_item">회원가입</a> <span class="footer_item">고객상담팀(수신자요금부담):080-023-5454 </span> <span class="footer_item">[상담시간] 월~금:AM 09:00~PM 06:00 </span> </div> </div> <div class="link_right"> <a href="#" class="link_item"> <img src="img/wa.png" alt="wa"> </a> <a href="#" class="link_item"> <i class="icon-facebook"></i> </a> <a href="#" class="link_item"> <i class="icon-instagram"></i> </a> <a href="#" class="link_item"> <i class="icon-youtube-play"></i> </a> </div> </div> <div class="footer_legal"> ©AMOREPACIFIC CORPORATION. All rights reserved. </div>  <div class="footer_mob"> <a href="#" class="link_loc">매장찾기 <i class="icon-location"></i> </a> <div class="footer_lang"> <a href="#" class="link-lang">한국어 <i class="icon-angle-up"></i> <i class="icon-angle-down"></i> </a> <ul class="select_lang_list"> <li> <a href="#">한국/한국어</a> </li> <li> <a href="#">International/English</a> </li> <li> <a href="#">中国大陆/中文</a> </li> <li> <a href="#">中國香港/繁體中文</a> </li> <li> <a href="#">Hong Kong(China)/English</a> </li> <li> <a href="#">Singapore/English</a> </li> <li> <a href="#">Malaysia/English</a> </li> <li> <a href="#">Việt Nam/Tiếng Việt</a> </li> <li> <a href="#">Indonesia/Bahasa Indonesia</a> </li> <li> <a href="#">ประเทศไทย/ไทย</a> </li> <li> <a href="#">USA/English</a> </li> <li> <a href="#">FRANCE/FRANCAIS</a> </li> </ul> </div> </div> </div> </div> </footer> </div>  <script src="js/lib/jquery-3.1.1.min.js"></script> <script src="js/nav.js"></script> <script src="js/visu.js"></script> <script src="js/content.js"></script> <script src="js/flag.js"></script> </body> </html> media.css @charset "utf-8"; @media screen and (max-width:1439px){ body { overflow-x:hidden; } .content{ width:auto; } .recommend{ margin-top:8.3333vw; } .recomm_tab{ margin-bottom:1.736vw; } .recomm_list_wrap{ height:auto; } .recomm_img img{ width:auto; height:20.139vw; } .lounge{ margin-top: 4.8611vw; padding: 0 6.25vw; height: 40.9722vw; } .lounge_img{ width:40.9722vw; } .lounge_img img{ width:100%; } .lounge_txt_wrap{ width:calc(100% - 49.8611vw) } .lounge_txt_wrap .sub_tit { margin: 2.7777vw 0 0; font-size: 3.19444vw; line-height: 4.5138vw; } .lounge_txt_wrap .desc { margin: 1.111vw 0 0; font-size: 1.3888vw; line-height: 2.2222vw; } .lounge_txt_wrap .btn_view { margin-top: 3.75vw; height: 2.638vw; padding: 0 3.0555vw; font-size: 1.0416vw; line-height: 2.6388vw; } .flagship { margin: 8.333vw 0 7.778vw; } .flag_txt_wrap{ left: 49vw; width: 25.777vw; } .flag_txt_wrap p { font-size: 1.25vw; line-height: 2.0833vw; } .flag_txt_wrap .btn_view { margin-top: 3.75vw; height: 2.63888vw; padding: 0 3.0555vw; font-size: 1.0416vw; line-height: 2.6388vw; } .flag_txt_wrap{ margin-top: 2.0833vw; } .flagside{ width: 3.1250vw; height: 5.481vw; top: calc(50% - 2.7083vw); } } @media screen and (max-width:999px){ .select_language { display: none; } .header_link>a:not(.h_open_search){ display: none; } .gnb{ display: none; } .header_wrap{ justify-content: center; height: 60px; } .header_link{ width: auto; padding-top: 0; } .header_link> a.h_open_search{ /*우선순위에 밀려서 앱소이 안먹힌다. 검사에 들가서 똑같이 더 길게 써준다 */ position: absolute; right: 10px; top: 10px; margin: 0; padding: 0; font-size: 24px; } .mob_nav_btn{ display: block; position: absolute; left: 20px; top: 18px; width: 20px; height: 20px; } .mob_nav_btn i{ position: relative; display: inline-block; width: 100%; height: 2px; background-color: #767676; } .mob_nav_btn i:after{ content: ""; position: absolute; display: block; top: -5px; left: 0; width: 100%; height: 2px; background-color: #767676; } .mob_nav_btn i:before{ content: ""; position: absolute; display: block; top: 5px; left: 0; width: 100%; height: 2px; background-color: #767676; } h1.logo img{ width: 140px; } /* nav */ .mob_nav{ display: block; position: fixed; left: -264px; top: 0; width: 264px; height: 100%; background-color: #363636; transition: 0.5s; } .mob_nav.move{ left: 0; } .mob_nav .bg{ position: fixed; top: 0; left: 264px; width: calc(100% - 264px); height: 100%; background-color: rgba(0,0,0,0.308); display: none; } .mob_nav_wrap{} .sidenav-h{ text-align: center; padding: 13px 0 12px; } .sidenav-h img{ width: 100px; } ul.m_nav_list{ border-top: 1px solid #494949; } ul.m_nav_list li> a{ display: block; position: relative; font-size: 15px; padding: 12px 0 12px 15px; border-bottom: 1px solid #494949; color: #d5d5d5; font-weight: 700; } ul.m_nav_list li> a.m_nav_tit.On{ background-color: #1d1d1d; } ul.m_nav_list .icon_nav{ position: absolute; right: 15px; top: calc(50% - 7px); width: 14px; height: 14px; display: block; } ul.m_nav_list .icon_nav:before{ content: ""; display: block; position: absolute; left: 0; top: calc(50% - 1px); width: 100%; height: 2px; background-color: #555; } ul.m_nav_list .icon_nav:after{ content: ""; display: block; position: absolute; left: 0; top: 50%; width: 100%; height: 2px; background-color: #555; transform: rotate(90deg); transition: 0.3s; } a.m_nav_tit.On .icon_nav:after{ transform: rotate(0); } .m_nav_list li>dl{ display: none; } .m_nav_list li>dl>dd{ border-bottom: 1px solid #414141; line-height: 1.6; font-weight: 700; } .m_nav_list li>dl>dd>a{ display: block; padding: 12px 0 12px 30px; font-size: 14px; } .m_nav_btm{ padding: 50px 0 12px 10px; font-size: 12px; color: #767676; line-height: 1.8; }/* | m_nav_cp안에 p 안에 첫번쨰 a 다음에 오는 모든 a들 */ .m_nav_cp p a { display: inline-block; color: #767676; line-height: 1.1; } .m_nav_cp p a +a { border-left: 1px solid #4f4f4f; padding-left: 7px; /* a앞에 |을 밀어야하는데, a기준으로 padding-left밀어야 글자랑 |가 분리되고 왼쪽공간과 |는 margin-left로 민다 */ margin-left: 3px ; } /* search */ #main.on{ filter: blur(10px); } .search_container.show { width: 100%; transition: none; position: fixed; top: 0; right: 0; padding: 10px; background-color: #fff; } .search_wrap input.text{ height: 40px; padding: 0 12px; } .search_wrap .submit{ top: 3px; right: -5px; } /* visual */ .visual_wrap{ height: 38.134vw; } .visu_tit { font-size: 2.917vw; line-height: 3.750vw; letter-spacing: -0.139vw; } .visu_txt_sub01 { font-size: 1.25vw; } .visu_txt_sub02 { margin: 3.194vw 0 0; font-size: 1.389vw; } .visu_txt_cont{ width:80%; } .visu_btn_wrap{ margin:2.083vw 0 0; } .visu_btn_wrap .btn_view{ width:9.167vw; height:2.639vw; font-size:1.042vw; line-height: 2.639vw; margin-left:0.694vw; } .visu_arrow{ width: 2.093vw; height: 4.028vw; margin-top: -2.014vw; background-size: contain; } .visu_arrow.left{ left:1.3889vw; } .visu_arrow.right{ right:1.3889vw; } .visu_btm_wrap { bottom: 1.667vw; } .visu_btm_wrap li{ padding: 0 0.347vw; } .visu_btm_wrap li a{ width: 0.694vw; width: 0.694vw; border-radius: 0.347vw; } /* recommend */ .recomm_tab { width: 52.917vw; } .buy_view_layer>a{ width:9.167vw; height:2.639vw; font-size:1.042vw; line-height: 2.639vw; padding: 0; } .flagside{ top: 50%; transform: translateY(-50%); background-size: 95%; } .flagside.right{ right: -5px; } .flag_txt_wrap { left: 55vw; width: 25.777vw; } /* footer */ .footer{ margin: 80px 0 0px; } .link_left { display: none; } .link_right .link_item:first-child{ display: none; } .foot_link { justify-content: center; } .footer_legal{ display: none; } .footer { border-top: none; margin: 0; } .footer_wrap{ padding: 0; } .link_right .link_item i{ font-size: 1.8em; line-height: 48px; } .footer_mob{ display: block; text-align: center; padding: 15px 0; } .footer_mob a, .footer_lang{ display: inline-block; width: 150px; text-align: center; position: relative; } .footer_mob> a:first-child:after{ content: ""; position: absolute; width: 1px; height: 12px; background-color: #d5d5d5; top: 30%; right: 0; } .footer_lang.show ul.select_lang_list{ visibility: visible; top: 30px; padding: 0 60px 0 20px; } .footer_lang.show .icon-angle-up{ opacity: 1; position: absolute; left: 95px; } .footer_lang.show .icon-angle-down{ opacity: 0; } .footer_mob a{ font-size: 2.2vw; } }/*end*/ /* 767px */ @media screen and (max-width:767px){ .header_wrap{ height: 50px; } .mob_nav_btn{ top: 12px; } .header_link>a.h_open_search{ top: 5px; } h1.logo img{ width: 112px; } .visual_wrap{ height: 135vw; } .visu_slide:nth-child(1){ background-image:url(../img/visu_mo_01.jpg); } .visu_slide:nth-child(2){ background-image:url(../img/visu_mo_02.jpg); } .visu_slide:nth-child(3){ background-image:url(../img/visu_mo_03.jpg); } .visu_veil{/*애니메이션은 비저빌리티로하면 더 나음*/ visibility: hidden; } .visu_txt_wrap{ top: auto; bottom: 0; width: 100%; height: 28.125vw; } .visu_txt_cont{ width: 100%; align-items:center; } .visu_txt_sub02{ display: none; } .visu_btn_wrap{ display: none; } .visu_slide:nth-child(1) .visu_txt_wrap{ background: rgba(237,185,46,.3); } .visu_slide:nth-child(2) .visu_txt_wrap{ background-color: rgba(164,105,53,.3); } .visu_slide:nth-child(3) .visu_txt_wrap{ background-color: rgba(140,171,217,.5); } .visu_tit{ font-size: 6.25vw; line-height: 7.188vw; letter-spacing: -0.1em; } .visu_txt_sub01{ font-size: 3.438vw; margin:1.250vw; letter-spacing: -0.1em; } ul.visu_btm_wrap{ bottom: -8vw; } li.visu_btm_list a{ width: 2.5vw; height: 2.5vw; background-color: #e7e7e7; border-right: 1.250vw; } .start.control{ background-image: url(../img/btn-play-mo.png); } .stop.control{ background-image: url(../img/btn-stop-mo.png); } .visu_arrow{ width: 20px; top: auto; bottom: -8.438vw; background-position: center top; padding: 0; } /* recommend */ .recommend{ margin-top: 21.875vw; } h2.cont_title{ font-size: 5vw; } .recomm_tab{ width: auto; height: 8.625vw; margin: 0 4.688vw; } .recomm_tab a.btn_tab{ font-size: 14px; line-height: 8.625vw; } ul.recomm_list.Act{ margin-top: 4.688vw; flex-wrap: wrap; /*공간부족하면 아래로 떨어뜨림*/ } ul.recomm_list li{ width: 50%; height: 68.438vw; padding: 0 1.25vw; cursor: pointer; } ul.recomm_list li:hover .buy_view_layer{ opacity: 0; } .recomm_img{ display: flex; height: 50vw; justify-content: center; align-items: center; border: 1px solid #eee; } ul.recomm_list li .recomm_img img{ width: auto; height: 30.139vw; } ul.recomm_list li .recomm_name{ padding: 1.875vw 0; font-size: 3.75vw; } /* lounge */ .cont02{ margin-top: 6.125px; background-color: #fafafa; padding: 22.9375vw 0; } .lounge_cont{ flex-flow: wrap; } .lounge_img{ width: auto; margin: 4.375vw 0; padding: 0 8.75vw; } .lounge{ height: auto; position: relative; padding: 0; } .lounge_txt_wrap{ width: 100%; padding: 0 8.75vw; } .lounge_txt_wrap h3{ position: absolute; top: -50px; width: 100%; font-size: 4.375vw; } .lounge_txt_wrap desc{ margin: 6.25vw 0 0; font-size: 4.0625vw; line-height: 6.5625vw; } .lounge_txt_wrap .btn_view{ height: 9.0625vw; padding: 0 9.375vw; font-size: 3.125vw; line-height: 9.0625vw; } .lou02 .lounge_img{ order:0; } .lou02 { margin-top: 31vw;; } /* flagship */ .flag_wrap{ height: auto; padding: 0 8.72vw 10.3125vw; background-image: url(../img/flag-bg-txt-mo.jpg); background-position: 0 100%; background-size: contain; } .flag_slider{ height: 82.5vw; } .flag_slider li.fl_01{ background-image: url(../img/flag-bg-mo-01.jpg); } .flag_slider li.fl_02{ background-image: url(../img/flag-bg-mo-02.jpg); } .flag_slider li.fl_03{ background-image: url(../img/flag-bg-mo-03.jpg); } .flag_slider li.fl_04{ background-image: url(../img/flag-bg-mo-04.jpg); } .flag_txt_wrap{ position: static; left: auto; width: 100%; } .flag_txt_wrap p{ font-size: 3.75vw; line-height: 6.5625vw; margin: 6.25vw 0 0; } .flag_txt_wrap .btn_view{ height: 9.0625vw; padding: 0 9.375vw; font-size: 3.125vw; line-height: 9.0625vw; } .flag_btm_wrap{ margin-top: 0; position: absolute; top: 74.375vw; left: 0; width: 100%; text-align: center; } .flagside{ width: 20px; height: 20px; top: 74.375vw; margin-top: 0; background-size: contain; } .flagside.left{ left: 12vw; } .flagside.right{ right: 10vw; } }/*end*/ content.js $(function(){ //footer const footer_l =$('.footer_lang') footer_l.click(footer_lang) function footer_lang(e){ e.preventDefault() $(this).toggleClass('show') } })

Jennifer oh · 2021.08.19 · 쉽게 배우고, 포트폴리오로 만드는 반응형 웹! #설화수

투표점수

1

조회수

320

답변

1
미해결
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화

update 뒤에 findOne 하면 문제가 생길 거 같습니다.

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(http://bit.ly/3fX6ygx)을 먼저 확인해주세요. 3. 질문 잘하기 메뉴얼(http://bit.ly/2UfeqCG)을 먼저 읽어주세요. 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 예2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 예3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) 예[질문 내용] 여기에 질문 내용을 남겨주세요. 회원 수정 api 강의에서 update 매서드가 id 만 반환하게 하고 바로 뒤에 findOne으로 다시 Member 조회를 하는데요. 보통 저런 경우 트랜잭션을 나눠서 update 는 마스터 디비에서 실행하고 findOne은 슬레이브 디비에서 실행하게 될 텐데 저렇게 바로 이어서 써버리면 master 에서 slave 로 동기화되기 전에 slave에 리드 쿼리가 날라가서 업데이트 이전 데이터가 나올 수 있을 것 같은데, 이러면 문제가 되지 않을까요? 그래서 그냥 update 에서 반환할 때 entity 객체 그대로 반환하는 게 좋을 것 같아서 질문드립니다.

웅이 · 2021.08.19 · 실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화

투표점수

0

조회수

180

답변

1
해결됨
[C++과 언리얼로 만드는 MMORPG 게임 개발 시리즈] Part4: 게임 서버

이렇게 작성하기에 앞서서 UML 다이어그램으로 구조 다 잡고서 만드시는건가요?

어떤 UML 다이어그램을 주로 사용하시는지 궁금합니다. 배운 내용을 참고해서 채팅 서버 포폴을 조금씩 만들고 있습니다. 사이즈가 커지니까 점점 뭐가 뭔지 제가 만든건데도 구조를 잡기가 힘드네요. 더불어수업 내용을 복습할 때도 다이어그램으로 구조를 잡아가면서 들어야할 것 같은 생각도 드는군요..

가나파이 · 2021.08.19 · [C++과 언리얼로 만드는 MMORPG 게임 개발 시리즈] Part4: 게임 서버

투표점수

1

조회수

715

답변

2
미해결
Axure RP 9,10 - 서비스 기획자를 위한 최적의 프로토타이핑 툴

각 페이지별 링크 생성 및 여러 페이지 모아보기 질문

안녕하세요 데이먼 선생님 노션과 연동하기 위해 작업을 해보고 있는데요. 2가지 궁금한 점이 있어 질문을 드립니다~ ※ 제가 아직 체험판이라 기능이 안되는건지 못 찾는건지 모르겠습니다. RP10을 사용하고 있습니다. 1. 각 페이지별 링크 생성 동영상에서 보여주신 것처럼 액슈어에서 각 페이지별 링크 생성은 어떻게 하는지 궁금합니다. 현재는 공유를 누르면 전체 또는 선택된 페이지 링크가 1개만 생성이 되어서요. 2. 한 화면에 페이지 모아보기 동영상에서는 공유 링크를 클릭했을때 여러 페이지가 한번에 모아보기로 나오는데 어떻게 하면 되는지 궁금합니다. 액슈어 관련 자료도 없고 강의도 없는 상황에 선생님의 강의는 정말 빛! 그 자체입니다. 너무 감사드립니다~^^

나는 오늘도 달린다. · 2021.08.19 · Axure RP 9,10 - 서비스 기획자를 위한 최적의 프로토타이핑 툴

투표점수

0

조회수

788

답변

3
미해결
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

안녕하세요. 레파지토리 리턴값에 대해 질문이있습니다.

1. 강의 내용과 관련된 질문인가요? 예2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 알려주신 주소로 들어가지지않습니다ㅠ3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예[질문 내용] 일반적으로 레파지토리를 생성하고 메서드들을 구현한뒤 해당 레파지토리를 서비스에서 받아 필요한 메서드들을 활용하게 되잖아요 레파지토리 메서드들은 리턴값이 있습니다 @Overridepublic Member save(Member member) { member.setId(++sequence); store.put(member.getId(), member); return member; } 그러나 서비스에서는 리턴값을 받아 활용하는부분없이 그냥 메서드 실행만 시켜주는 모습입니다. public Long join(Member member){ validateDuplicateMember(member); memberRepository.save(member); return member.getId(); } 즉, 레파지토리나 서비스에서 리턴값이 있는 메서드들을 구현하게하는것이 실무에서는 사용되기때문인지, 아니면 스프링 흐름때문에 만들어줘야 하는것인지, 그 이유가 궁금합니다!

메모장 · 2021.08.19 · 스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

투표점수

0

조회수

191

답변

1
미해결
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

이해안되는부분이 후반부에 나오겠지했는데 답을 알수없어 질문드립니다ㅜ

1. 강의 내용과 관련된 질문인가요? 예2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 질문게시판이 안들어가집니다ㅠ3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예[질문 내용] 레포지토리에서 여러 메서드들을 만든후 해당 메서드들을 서비스에서 가져가서 다시 활용하게되는데, 이과정에서 레포지토리 메서드들에 리턴값을 주잖아요? @Overridepublic Member save(Member member) { //위에 내가 생성했던 도메인패키지의 Member클레스(도메인)가 임포트되어있기에 객체 생성없이 레퍼런스변수를 통해 메서드가 접근 가능한 모습. member.setId(++sequence); store.put(member.getId(), member); return member; //나중에 갖다쓸려고 member 객체로 리턴하는듯.} 근데 막상 서비스에서 가져다쓸때는 그냥 실행만 시킬뿐, 실제로 리턴한 member객체 자체를 사용하는경우를 못본거같습니다. 즉, 사용하지않을 객체를 return값으로 남기는 이유가 궁금합니다!

메모장 · 2021.08.19 · 스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

투표점수

0

조회수

183

답변

1
미해결
스프링 MVC 1편 - 백엔드 웹 개발 핵심 기술

무료버전 JSP 파일 생성시

무료버전으로 인텔리제이 사용 중입니다 영상 보면서 members에 jsp 파일 만들려고 하는데 file을 통해서 만들면 파일에 물음표가 떠있고 인식을 못합니다. 무료버전은 아예 인식이 안되나요?

cp3 · 2021.08.19 · 스프링 MVC 1편 - 백엔드 웹 개발 핵심 기술

투표점수

0

조회수

691

답변

1
미해결
스프링 핵심 원리 - 기본편

Object 타입을 스프링빈에 등록할경우..

강의 내용중 예를들어 설명하시면서 Object 타입의 변수를 final로 선언 하시는걸 보고 문뜩 생각이 났는데 @Component@RequiredArgsConstructor public class OrderServiceImpl implements OrderService { private final Object object; private final MemberRepository memberRepository; private final DiscountPolicy discountPolicy; 이렇게 선언을 하게되면 생성자에 object 도 포함되면서 object도 자동으로 스프링컨테이너에 등록되는건가요? 그리고 스프링빈으로 등록된 경우 Object는 최상위 부모이기때문에 모든타입의 자식을 주입받을수 있게되는데 자동으로 어떤형태의 객체를 주입받게 되나요?

심모 · 2021.08.19 · 스프링 핵심 원리 - 기본편

투표점수

0

조회수

176

답변

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

선생님 apply 함수 질문드립니다.

null 처리함수에서 apply 함수를 적용시킬려고 했는데 key error가 뜨네요 왜 그런가요??

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

투표점수

0

조회수

194

답변

1
미해결
설계독학맛비's 실전 Verilog HDL Season 1 (Clock부터 Internal Memory까지)

verilog에서 parameter와 'define 사용이 비슷한 것 같은데 어떤 차이점이 있나요?

코드를 분석하다보니 parameter와 define이 비슷한 생각이 들어서요 어떤 차이점이 있나요? 또 어떤한 경우에 각각을 사용하면 좋을까요?

HYUNCHUL JOO · 2021.08.19 · 설계독학맛비's 실전 Verilog HDL Season 1 (Clock부터 Internal Memory까지)

투표점수

1

조회수

9.6k

답변

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

선생님 혹시 글씨효과 아래에서 위로 채우는 건 불가능할까요?

#gnb9 #menu3 li a::before { position: absolute; color: red; top: 0; left: 0; white-space: nowrap; content: attr(data-m2); height: 0%; transition: 0.3s; overflow: hidden; } #gnb9 #menu3 li a:hover::before { height: 100%; }. 이렇게 했는데 위에서 아래로 밖에 안되더라구요 그래도 top:0을 bottom으로 바꾸고 다시 시도해봤는데 안되네요 <section> <div id="gnb9"> <ul id="menu3"> <li><a href="#home" data-m2="회사소개">회사소개</a></li> <li><a href="#profile" data-m2="비전">비전</a></li> <li><a href="#vision" data-m2="포트폴리오">포트폴리오</a></li> <li><a href="#works1" data-m2="채용공고">채용공고</a></l> </ul> </div> <div class="pic"></div> </section>

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

투표점수

1

조회수

712

답변

3
미해결
[C#과 유니티로 만드는 MMORPG 게임 개발 시리즈] Part4: 게임 서버

이건 컴퓨터 성능 때문일까요?

안녕하세요, 선생님 c# 게임 서버 강의를 수강하다가 선생님과 다르게 작동하는 부분이 있어서 질문드립니다 6번째 강의인 컴파일러 최적화 강의에서 코드를 실행하면 4:25초경에 쓰레드 시작! 쓰레드 종료! Stop 호출 종료 대기중 종료 성공 이 순서대로 선생님은 실행이 되는데요, 저는 쓰레드 시작! Stop 호출 종료 대기중 쓰레드 종료! 종료 성공 순서로 쓰레드 종료!가 더 늦게 뜨네요 강의에서처럼 _stop에 volatile을 붙이면 선생님이랑 같은 값이 나오긴 하는데 컴퓨터 성능 차이 때문일 수 있나요? 코드가 다른 부분은 없습니다. 몇 번이고 확인했어요 감사합니다!

potentialk · 2021.08.19 · [C#과 유니티로 만드는 MMORPG 게임 개발 시리즈] Part4: 게임 서버

투표점수

0

조회수

177

답변

1
미해결
실전 리액트 프로그래밍

공부하다가~! 질문이 있습니다.

해당 소스를 콘솔로 찍어봤을 때 useSelector 함수가 동작하는 순서가 궁금합니다. 초기 랜더링 전에 useSelector 함수가 동작하여 1 이 찍혔고 아무런 액션이 발생하지 않았음에도 렌더링 후에 다시 한 번 useSelector 함수가 동작하여 찍혔습니다. 물론 store에서의 state값이 변하지 않았으므로 재렌더링은 일어나지 않았습니다. 하지만...왜 이렇게 찍히는지 궁금합니다.

woweodns · 2021.08.19 · 실전 리액트 프로그래밍

투표점수

0

조회수

220

답변

1
미해결
초보를 위한 도커 안내서

volume 질문

안녕하세요. 좋은 강의 잘 듣고 있습니다. 질문 1-1. -v 옵션에서 앞 경로는 호스트(서버)의 경로이고 뒷 경로는 컨테이너 내부의 경로라고 하셨는데, 앞 경로가 이해가 안됩니다. 실습에서 보여주신건 앞 경로는 도커로 만든 워드프레스 컨테이너의 경로이고, 뒷 경로도 도커로 만든 mysql 컨테이너의 경로 아닌가요? 질문 1-2. 아니면 앞 경로가 도커로 만든 워드프레스의 데이터가 내컴퓨터에 저장이 되었고 그것을 가리키는 경로라고 이해하면 되나요? 질문 1-3. 뒷 경로가 /var/lib/mysql 이고 이게 컨테이너 내부의 경로라고 하셨는데요, 그럼 컨테이너 내부로 들어가기전에 컨테이너의 경로를 지정해주어야 한다고 생각하는데, 그거는 run 으로 mysql 컨테이너를 실행해주니까 따로 지정해주지 않는거라고 이해하면 되나요? 질문 2. 강의에서 docker stop mysql docker rm mysql 의 명령어로 mysql 컨테이너를 삭제해도 “-v 앞 경로의 디렉토리로 다시 물고 올라가서, 컨테이너에 있는 디렉토리가 내 PC에도 있기 때문에 사라지지 않고 남아있다” 라고 하셨는데요 컨테이너를 지웠는데 디렉토리가 내 PC에 어떻게 남아있는 건지 이해가 안됩니다. 감사합니다.

석국수 · 2021.08.19 · 초보를 위한 도커 안내서

투표점수

1

조회수

271

답변

1
미해결
초보를 위한 도커 안내서

이미지, 컨테이너가 저장되는 곳?

docker run 을 통해 이미지, 컨테이너를 저장하고 docker pull 을 통해 이미지를 저장하는데, 이미지나 컨테이너가 저장되는 위치는 어디인가요? 제 컴퓨터(서버)에 저장되는거 아닌가요?

석국수 · 2021.08.19 · 초보를 위한 도커 안내서

투표점수

3

조회수

523

답변

2
미해결
파이썬 알고리즘 문제풀이 입문(코딩테스트 대비)

그냥 혼자 풀었는데 다른 답안을 보니 정말 심플하게 풀엇네요!

최솟값 강의를 안듣고 풀엇엇는데 제 답을보니 정말 무식하게 풀엇다는 생각이 드네요 ㅠ 두 숫자의 합을 인덱스로 사용하는걸 생각도 못햇네요. 앞으로는 규칙성 찾는것에 시간을 좀더 투자해야겟어요. import sys #sys.stdin=open("input.txt","rt") N,M=map(int,input().split()) boxn=[] for i in range(N): boxn.append(i+1) boxm=[] for i in range(M): boxm.append(i+1) sum_box=[] sum_set=set() for i in range(N): for j in range(M): sum_box.append(boxn[i]+boxm[j]) sum_set.add(boxn[i]+boxm[j]) sum_list=list(sum_set) count_num=[] for x in range(len(sum_set)): count_num.append(sum_box.count(sum_list[x])) for x in range(len(sum_list)): sum_list[x]=(sum_list[x],count_num[x]) sum_list.sort(key=lambda x: (-x[1], x[0])) final_num=[] final_num.append(sum_list[0][0]) for x in range(len(sum_list)-1): if sum_list[0][1]==sum_list[x+1][1]: final_num.append(sum_list[x+1][0]) for i in range(len(final_num)): print(final_num[i], end=' ')

jsh940517 · 2021.08.19 · 파이썬 알고리즘 문제풀이 입문(코딩테스트 대비)

투표점수

0

조회수

225

답변

1
미해결
우리를 위한 프로그래밍 : 파이썬 중급 (Inflearn Original)

% 연산자 관련 질문입니다

안녕하세요 강의에서 % 연산자의 사용에 관해 궁금한 점이 있습니다 print(list(map(var_func, filter(lambda x : x % 2, range(1, 6))))) print([var_func(i) for i in range(1, 6) if i % 2]) 다음과 같이 작성한 코드에서요 % 연산자는 나머지를 반환하는데, 숫자가 2로 나누어 떨어지는 경우 그러니까 나머지가 0인 경우는 자동으로 False로 인식되어 연산 과정에 포함되지 않는 것으로 이해하면 되나요?

vpdtlrdl · 2021.08.19 · 우리를 위한 프로그래밍 : 파이썬 중급 (Inflearn Original)

투표점수

0

조회수

187

답변

1
미해결
3dsmax 초급부터 전문가까지 - 한방에 끝내는 3dsmax 강좌

nurms 질문

nurms 2정도를 줄때 면수는 그닥 많지 않아보이는데 여기에서 editable poly를 하면 면수가 엄청 늘어납니다. 면수가 늘어나지 않고 하는 방법은 없는건가요?

손손장 · 2021.08.19 · 3dsmax 초급부터 전문가까지 - 한방에 끝내는 3dsmax 강좌

투표점수

0

조회수

239

답변

1
미해결
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화

JPQLQuery 사용시 order by 질문 드립니다

질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요~ JPQLQuery 사용시 order by 를 할 때 대상컬럼이 숫자가 아니라 문자형인 경우에 대한 질문입니다. 예를 들어 데이터가 10, 20, 100 이면 숫자일 때는 크기순으로 정렬에 문제가 없는데 문자형일 때는 결과가 다르네요(당연하지만 ㅎ) .orderBy 내에서 대상 컬럼을 int 형으로 캐스팅해서 쓰는 것도 안되고.. 좋은 방법이 없을지 고견을 여쭙습니다. 감사합니다.

renivie · 2021.08.19 · 실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화

투표점수

0

조회수

307

답변

1
해결됨
[리뉴얼] React로 NodeBird SNS 만들기

Unhandled Runtime Error 로그인이 왜 안될까요?

import React, { useCallback, useState } from 'react'; import { Form, Input, Button } from 'antd'; import Link from 'next/link'; import styled from 'styled-components'; const ButtonWrapper = styled.div` margin-top: 10px; `; // const ButtonStyle = styled(Button)` // color: red; // background-color: green; // `; const FormWrapper = styled(Form)` padding: 10px; `; const LoginForm = ({ setIsLoggedIn }) => { const [id, setId] = useState(''); const [password, setPassword] = useState(''); const onchangeId = useCallback((e) => { setId(e.target.value); }, []); const onchangePassword = useCallback((e) => { setPassword(e.target.value); }, []); // const style = useMemo(() => ({ marginTop: 10 }), []); // 스타일컴포넌트 쓰기 싫을떄 const onSubmitForm = useCallback(() => { console.log(id, password); console.log(setIsLoggedIn); setIsLoggedIn(true); }, [id, password]); return ( <FormWrapper onFinish={onSubmitForm}> <div> <label htmlFor="user-id">아이디</label> <br /> <Input name="user-id" value={id} onChange={onchangeId} required /> </div> <div> <label htmlFor="user-password">비밀번호</label> <br /> <Input name="user-password" type="password" value={password} onChange={onchangePassword} required /> </div> <ButtonWrapper> {/* style={style} */} <Button type="primary" htmlType="submit" loading={false}> 로그인 </Button> <Link href="/signup"> <a> <Button>회원가입</Button> </a> </Link> </ButtonWrapper> </FormWrapper> ); }; export default LoginForm;

허성진 · 2021.08.19 · [리뉴얼] React로 NodeBird SNS 만들기

투표점수

0

조회수

195

답변

1

인기 태그

주간 인기글