-
Notifications
You must be signed in to change notification settings - Fork 4
[당근마켓 클론코딩] 권민재 미션 제출합니다. #5
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Changes from all commits
2556eb1
16995bf
3d28012
35f90fd
b3290cf
be09d11
83a185c
6509a6c
3239245
89602b6
17396e3
de0efda
aa75961
2187cbe
3473d35
6bcc56b
677b0af
f976287
6884fc8
9b91afe
021b407
1317eaf
7f269e5
4fb122f
e8ae1f9
89affba
fa98276
b5aecaf
2007e25
93c0a24
fc5d06e
6f36925
ff9ab84
54157ed
5b997a9
2b69396
803de53
9bf1d8b
0f0103d
5b2729b
2cf88eb
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
This file was deleted.
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,114 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="ko"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>당근마켓 클론</title> | ||
| <link rel="stylesheet" href="style.css"/> | ||
|
|
||
| </head> | ||
| <body> | ||
| <header class="scroll_bar"> | ||
| <div class="header_container"> | ||
| <div class="logo"> | ||
| <a href="./index.html"><img src="../assets/daangn-clone-logo.png" alt="당근 로고" width="110px"></a> | ||
| </div> | ||
|
|
||
| <div class="headButton"> | ||
| <a href="./fleamarket.html"><div id="headclick6">중고거래</div></a> | ||
| <div id="headclick2">동네업체</div> | ||
| <div id="headclick3">알바</div> | ||
| <div id="headclick4">부동산</div> | ||
| <div id="headclick5">중고차 직거래</div> | ||
| </div> | ||
|
|
||
| <div class="head_chat"> | ||
| <h4>채팅하기</h4> | ||
| </div> | ||
| <input type="text" class="head_search" placeholder="물품이나 상품을 검색해보세요"> | ||
| </div> | ||
| </header> | ||
|
|
||
| <main> | ||
| <div class="fleamarket_container"> | ||
| <div class="mainfleainfo"> | ||
| <div class="mainfleacontainer"> | ||
| <h1 class="fleamarket_ibm-plex-sans-kr-regular">믿을만한<br>이웃 간 중고거래</h1> | ||
| <br> | ||
| <p class="fleamarket_p">동네 주민들과 가깝고 따뜻한 거래를<br>지금 경험해보세요.</p> | ||
| </div> | ||
| <div class="fleamarket_picture"> | ||
| <img src="../assets/fleamarketpicture.jpg" alt="플리마켓 사진" width="400" height="315"> | ||
|
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 인라인 스타일은 지양해주세요! |
||
| </div> | ||
| </div> | ||
|
|
||
| <h1 class="fleamarket_h1">중고거래 인기매물</h1> | ||
|
|
||
| <div class="flea_box"> | ||
|
|
||
| </div> | ||
| <h3 class="fleamarket_h3">인기매물 더보기</h3> | ||
| </div> | ||
| </main> | ||
|
|
||
|
|
||
| <hr color="#ebecee"> | ||
| <footer class="footer_d"> | ||
| <div class="footer_text"> | ||
| <div class="footer_text_div"> | ||
| <h4>당근 앱 다운로드</h4> | ||
| <br> | ||
| <a href="https://play.google.com/store/apps/details?id=com.towneers.www" target = "_blank"> | ||
| <section id="downloadButton-black"> | ||
| <div id="download_picture"><img src="../assets/google-logo-black.png" alt="구글 로고" width="30px" height="25px"></div> | ||
| <div id="download_write-black">Google Play</div> | ||
| </section> | ||
| </a> | ||
| <a href="https://apps.apple.com/us/app/karrot-buy-sell-locally/id1018769995" target = "_blank"> | ||
| <section id="downloadButton-black"> | ||
| <div id="download_picture"><img src="../assets/apple-logo-black.png" alt="애플 로고" width="30px" height="25px"></div> | ||
| <div id="download_write-black">App Store</div> | ||
| </section> | ||
| </a> | ||
| </div> | ||
|
|
||
| <div class="footer_text_ul"> | ||
| <ul> | ||
| <li>중고거래</li> | ||
| <li>동네업체</li> | ||
| <li>당근알바</li> | ||
| <li>부동산</li> | ||
| <li>중고차 직거래</li> | ||
| </ul> | ||
| <ul> | ||
| <li>당근비즈니스</li> | ||
| <li>채팅하기</li> | ||
| </ul> | ||
| <ul> | ||
| <li>자주 묻는 질문</li> | ||
| <li>회사 소개</li> | ||
| <li>인재 채용</li> | ||
| </ul> | ||
| </div> | ||
| <br> | ||
| <br> | ||
| <hr> | ||
| <div class="footer_text_under"> | ||
| <img src="../assets/footer_picture.png" alt="홈페이지" width="280" height="55"> | ||
| <br> | ||
| <h4>대표 김용현, 황도연 | 사업자번호 375-87-00088</h4> | ||
| <h4>직업정보제공사업 신고번호 J1200020200016</h4> | ||
| <h4>통신판매업 신고번호 2021-서울서초-2875</h4> | ||
| <h4>주소 서울특별시 구로구 디지털로 300, 10층 (당근서비스)</h4> | ||
| <h4>전화 1544-9796 | 고객문의 cs@daangnservice.com</h4> | ||
| <br> | ||
| <h4>제휴 문의 광고 문의 PR 문의 IR 문의</h4> | ||
| <br> | ||
| <h4>이용약관 개인정보처리방침 운영정책 위치기반서비스 이용약관 이용자보호 비전과 계획 청소년보호정책</h4> | ||
|
Comment on lines
+105
to
+107
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 띄워쓰기로 간격을 맞추기 보단 태그로 전체를 묶은 후 display: flex를 사용하는게 좋을 것 같습니다. |
||
| </div> | ||
| </div> | ||
| </footer> | ||
|
|
||
| <script src="./script.js"></script> | ||
| </body> | ||
| </html> | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,210 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <html lang="ko"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>당근마켓 클론</title> | ||
| <link rel="stylesheet" href="style.css"/> | ||
|
|
||
| </head> | ||
| <body> | ||
| <header class="scroll_bar"> | ||
| <div class="header_container"> | ||
| <div class="logo"> | ||
| <a href="./index.html"><img src="../assets/daangn-clone-logo.png" alt="당근 로고" width="110px"></a> | ||
| </div> | ||
|
|
||
| <div class="headButton"> | ||
| <a href="./fleamarket.html"><div id="headclick">중고거래</div></a> | ||
| <div id="headclick2">동네업체</div> | ||
| <div id="headclick3">알바</div> | ||
| <div id="headclick4">부동산</div> | ||
| <div id="headclick5">중고차 직거래</div> | ||
| </div> | ||
|
|
||
| <div class="head_chat"> | ||
| <h4>채팅하기</h4> | ||
| </div> | ||
| <input type="text" class="head_search" placeholder="물품이나 상품을 검색해보세요"> | ||
| </div> | ||
| </header> | ||
|
|
||
| <main> | ||
| <div class="indexcontainer"> | ||
| <div class="container-yellow"> | ||
| <div id="text-box"> | ||
| <h1 class="ibm-plex-sans-kr-regular">당신 근처의<br>지역 생활 커뮤니티</h1> | ||
| <br> | ||
| <p class="nanum-gothic-regular">동네라서 가능한 모든 것<br>당근에서 가까운 이웃과 함께해요.</p> | ||
| <br> | ||
| <a href="https://play.google.com/store/apps/details?id=com.towneers.www" target = "_blank"> | ||
| <section id="downloadButton"> | ||
| <div id="download_picture"><img src="../assets/google-logo.png" alt="구글 로고" width="30px" height="30px"></div> | ||
| <div id="download_write">Google Play</div> | ||
| </section> | ||
| </a> | ||
|
|
||
| <a href="https://apps.apple.com/us/app/karrot-buy-sell-locally/id1018769995" target = "_blank"> | ||
| <section id="downloadButton"> | ||
| <div id="download_picture"><img src="../assets/apple-logo.png" alt="애플 로고" width="42px" height="34px"></div> | ||
| <div id="download_write">App Store</div> | ||
| </section> | ||
| </a> | ||
| </div> | ||
|
|
||
| <div class="mascot"> | ||
| <img src="../assets/daangn-clone-mascot.jpg" alt="당근 마스코트" width="655" height="800"> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="container-white"> | ||
| <div class="main_tmpPicture"> | ||
| <img src="../assets/daangn-clone-tem.jpg" alt="매너온도" width="640" height="720"> | ||
| </div> | ||
|
|
||
| <div class="container-text-white"> | ||
| <p class="nanum-gothic-regular-orange">중고거래</p> | ||
| <h1 class="ibm-plex-sans-kr-regular">믿을만한<br>이웃 간 중고거래</h1> | ||
| <br> | ||
| <p class="nanum-gothic-regular">동네 주민들과 가깝고 따뜻한 거래를<br>지금 경험해보세요.</p> | ||
| <br> | ||
|
|
||
| <div id="grayButton"> | ||
| <h3>인기매물</h3> | ||
| </div> | ||
| <div id="grayButton2"> | ||
| <h3>믿을 수 있는 중고거래</h3> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="container-red"> | ||
| <div class="main_vPicture"> | ||
| <img src="../assets/v_info.jpg" alt="동네 정보" width="640" height="720"> | ||
| </div> | ||
|
|
||
| <div class="container-text-red"> | ||
| <p class="nanum-gothic-regular-orange">동네생활</p> | ||
| <h1 class="ibm-plex-sans-kr-regular">이웃만 아는<br>동네 정보와 이야기</h1> | ||
| <br> | ||
| <p class="nanum-gothic-regular">우리동네의 다양한 정보와 이야기를<br>공감과 댓글로 나누어요.</p> | ||
| <br> | ||
| <div id="village_info"> | ||
| <img src="../assets/동네모임.png" alt="동네모임" width="75px" height="75px"> | ||
| <div id="village_text"> | ||
| <h5>동네모임</h5> | ||
| <p class="p-nanum-gothic-regular">근처 이웃들과 동네<br>이야기를 해보세요.</p> | ||
| </div> | ||
| </div> | ||
| <div id="village_info_left"> | ||
| <img src="../assets/동네질문.png" alt="동네질문" width="75px" height="75px"> | ||
| <div id="village_text"> | ||
| <h5>동네질문</h5> | ||
| <p class="p-nanum-gothic-regular">궁금한 게 있을 땐<br>이웃에게 물어보세요.</p> | ||
| </div> | ||
| </div> | ||
| <div id="village_info_left"> | ||
| <img src="../assets/동네분실센터.png" alt="동네분실센터" width="75px" height="75px"> | ||
| <div id="village_text"> | ||
| <h5>동네분실센터</h5> | ||
| <p class="p-nanum-gothic-regular">무언가를 잃어버렸다면<br>글을 올려보세요.</p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="container-white"> | ||
| <div class="main_supportPicture"> | ||
| <img src="../assets/지원서.jpg" alt="지원서" width="640" height="720"> | ||
| </div> | ||
|
|
||
| <div class="container-text-white"> | ||
| <p class="nanum-gothic-regular-orange">알바</p> | ||
| <h1 class="ibm-plex-sans-kr-regular">걸어서 10분!<br>동네 알바 구하기</h1> | ||
| <br> | ||
| <p class="nanum-gothic-regular">당근하듯 쉽고, 편하게<br>당근 알바로 동네 알바를 구할 수 있어요.</p> | ||
| <br> | ||
| <div id="grayButton3"> | ||
| <h3>내근처 알바 보기</h3> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="container-green"> | ||
| <div class="main_vPicture"> | ||
| <img src="../assets/내근처.jpg" alt="내근처" width="640" height="720"> | ||
| </div> | ||
| <div class="container-text-green"> | ||
| <p class="nanum-gothic-regular-orange">동네업체</p> | ||
| <h1 class="ibm-plex-sans-kr-regular">내 근처에서 찾는<br>동네업체</h1> | ||
| <br> | ||
| <p class="nanum-gothic-regular">이웃들의 추천 후기를 확인하고<br>동네 곳곳의 업체들을 찾을 수 있어요.</p> | ||
| <br> | ||
| <div id="grayButton3"> | ||
| <h3>당근 동네업체 보기</h3> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| </main> | ||
| <hr color="#ebecee"> | ||
| <footer class="footer_d"> | ||
| <div class="footer_text"> | ||
| <div class="footer_text_div"> | ||
| <h4>당근 앱 다운로드</h4> | ||
| <br> | ||
| <a href="https://play.google.com/store/apps/details?id=com.towneers.www" target = "_blank"> | ||
| <section id="downloadButton-black"> | ||
| <div id="download_picture"><img src="../assets/google-logo-black.png" alt="구글 로고" width="30px" height="25px"></div> | ||
| <div id="download_write-black">Google Play</div> | ||
| </section> | ||
| </a> | ||
| <a href="https://apps.apple.com/us/app/karrot-buy-sell-locally/id1018769995" target = "_blank"> | ||
| <section id="downloadButton-black"> | ||
| <div id="download_picture"><img src="../assets/apple-logo-black.png" alt="애플 로고" width="30px" height="25px"></div> | ||
| <div id="download_write-black">App Store</div> | ||
| </section> | ||
| </a> | ||
| </div> | ||
|
|
||
| <div class="footer_text_ul"> | ||
| <ul> | ||
| <li>중고거래</li> | ||
| <li>동네업체</li> | ||
| <li>당근알바</li> | ||
| <li>부동산</li> | ||
| <li>중고차 직거래</li> | ||
| </ul> | ||
| <ul> | ||
| <li>당근비즈니스</li> | ||
| <li>채팅하기</li> | ||
| </ul> | ||
| <ul> | ||
| <li>자주 묻는 질문</li> | ||
| <li>회사 소개</li> | ||
| <li>인재 채용</li> | ||
| </ul> | ||
| </div> | ||
| <br> | ||
| <br> | ||
| <hr> | ||
| <div class="footer_text_under"> | ||
| <img src="../assets/footer_picture.png" alt="홈페이지" width="280" height="55"> | ||
| <br> | ||
| <h4>대표 김용현, 황도연 | 사업자번호 375-87-00088</h4> | ||
| <h4>직업정보제공사업 신고번호 J1200020200016</h4> | ||
| <h4>통신판매업 신고번호 2021-서울서초-2875</h4> | ||
| <h4>주소 서울특별시 구로구 디지털로 300, 10층 (당근서비스)</h4> | ||
| <h4>전화 1544-9796 | 고객문의 cs@daangnservice.com</h4> | ||
| <br> | ||
| <h4>제휴 문의 광고 문의 PR 문의 IR 문의</h4> | ||
| <br> | ||
| <h4>이용약관 개인정보처리방침 운영정책 위치기반서비스 이용약관 이용자보호 비전과 계획 청소년보호정책</h4> | ||
| </div> | ||
| </div> | ||
| </footer> | ||
|
|
||
| </body> | ||
| </html> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
태그가 닫히지 않았습니다.. 위와같이 셀프 클로징 태그를 써주세요!!