Conversation
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> |
There was a problem hiding this comment.
메타태그까지 적용해주셨네요 👍 꼼꼼하십니다!
There was a problem hiding this comment.
다양한 시맨틱 태그를 활용해서 적절하게 잘 작성하신것같아요. 굳굳 👍
| </div> | ||
| </section> | ||
| <!-- search --> | ||
| <section class="flex-reverse"> |
There was a problem hiding this comment.
flex reverse스타일 주신것도 좋네요! 다만 이름이 상태만 나타낸다기보다는 어떤 역할을 하는지 좀더 잘 보이게 네이밍 고려해보면 좋을것같아요. html + css의 경우 BEM 네이밍 규칙을 일반적으로 많이 적용하긴한답니다,
아래 아티클 참고해서 사용해보세요! :)
| <h2> | ||
| Search | ||
| </h2> | ||
| <p> |
There was a problem hiding this comment.
paragraph안에서 나눠지는 텍스트는 span 인라인 요소를 사용하는 편이 깔끔하죠 :)
잘하셨습니다~!
| </section> | ||
| <!-- Register --> | ||
| <section> | ||
| <img src="img/Img_home_03.png" alt="상품 등록 안내"/> |
There was a problem hiding this comment.
alt 텍스트도 잊지않고 챙겨주셨네요 👍 👍
| <img src="img/Img_home_bottom.png" alt="판다마켓 광고 배너"/> | ||
| </div> | ||
| </aside> | ||
|
|
There was a problem hiding this comment.
요런 필요없는 공백은 PR 올리기전에 삭제해주시는게 좋습니다!
| @@ -0,0 +1,198 @@ | |||
| @import "reset.css"; | |||
There was a problem hiding this comment.
import 방식으로 잘 가지고오셨네요 👍
css파일을 연결하는 방식에 따라서도 우선순위가 조절되기때문에
한가지 방식으로 통일해서 가져오시는게 좋답니다!
자세한 디테일은 블로그 참고해보세요 :)
| } | ||
|
|
||
| .flex-reverse { | ||
| flex-direction: row-reverse; |
There was a problem hiding this comment.
굳굳! flex item의 순서를 조절하고싶으면 order라는 속성을 사용하셔도됩니다 :)
mdn 문서 참고해보세요!
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flexible_box_layout/Ordering_flex_items
요구사항
기본
심화
주요 변경사항
사이트로 이동
스크린샷
멘토에게