💻 학습 내용

🛫 코드 깃허브 링크
webtoon_main_right | html
webtoo_main_right | css

webtoon_footer | html
webtoon_footer | css

webtoon_detail_nav | html
webtoon_detail_nav | css

webtoon_detail_main_left | html
webtoon_detail_main_left | css

main_right_rank 부분

• 리스트가 순서가 있고, 의미가 있는 리스트라면 ol태그를 사용해야 함
• 말줄임 표(…) 만드는 코드

white-space: nowrap;
text-overflow: ellipsis;

• 데코레이션이 없는 속성값을 가진 ol, ul태그의 초기화 작업을 없애고
  본래의 상태로 되돌리는 방법 ➜ list-style: decimal;

footer 부분

• 저작권 표시를 넣을 수 있는 html 특수문자가 있음
  © 를 작성해주면 © 가 작성됨
  실무에서 많이 사용되는 편은 아님
• css에서 html에 작성된 글자들을 대문자, 앞글자만 대문자, 소문자로 작성할 수 있는 코드

text-transform: uppercase; 
text-transform: capitalize;
text-transform: lowercase;

📝 마무리

오늘도 계속해서 네이버 웹툰 페이지를 카피캣 하는 방법을 배웠다
화면의 구성을 짜고 div로 공간을 나누는게 많이 헷갈렸다.
그렇지만 구성을 짤 때 header에서 left right로 나누고 main에서 left right로 나누는 것을 계속 연습하다 보니 공간 나누는 법이 눈에 익기 시작했다.
지금까지는 계속 ul과 li 조합만을 사용했는데 오늘은 순위를 매기는 순서라서 ul과 ol태그를 사용해봤다.
사용법은 동일해서 어렵지는 않았다.
오늘 수업도 재미있었다.
복잡하고 헷갈리지만 꾸준히 연습해나가야겠다.