Day 3 HTML과 CSS

2022.06.27

2022. . 

---

1. 오늘의 학습

• 학습 1

• 학습 2

• 학습 3

---

2. 학습 목표

• HTML이 "구조를 표현하는 언어"라는 것을 이해하고, 그 기본 구조와 문법을 설명할 수 있다. 🔺

: 아주 기초적인 이해만 했을 뿐이다. 

• HTML이 마크업 언어라는 것을 설명할 수 있다. 🔺

: 아주 기초적인 이해만 했을 뿐이다. 

• 자주 사용되는 HTML 요소(Element)가 무엇인지 알고 차이를 설명할 수 있다. 🔺

: 아주아주 기초적인, 오늘 배운 정도의 요소의 차이는 안다. 

• 시맨틱 태그가 무엇인지 이해하고, 왜 사용하는 지 설명할 수 있다 🔺

: 지금은 잘 설명 할 수 있을 것 같은데, 시간이 지나면 어려울 것 같다.

• 웹 문서의 구조와 내용을 HTML로 작성할 수 있다. ⭕️

: 수업에 적힌 것을 따라가는 기초적인 구조정도는 작성할 수 있을 것 같다.

• CSS의 사용 목적을 이해하고, 기본적인 문법과 구조를 설명할 수 있다.🔺

: 이해는 했으나, 설명을 하기에는 아직 내 언어로 정리가 덜 되어 있는 것 같다. 조금 더 정리를 해보자.

• HTML에 CSS를 적용하는 방법에 대해 이해할 수 있다. ⭕️

: link를 통해 할 수 있다. 

• 직접 HTML 안에 CSS를 정의하는 것을 권장하지 않는 이유를 설명할 수 있다. ⭕️

: 코드가 길어졌을 때, 수정에 용이하기 위함이라는 것을 알고 설명할 수 있다.

• CSS를 이용해 텍스트를 꾸밀 수 있다. ⭕️

: 텍스트의 글씨나 색 정도만 바꿀 수 있다. 이 정도도 꾸민 것이라면, 꾸민 것이지 않을까.

• 기본적인 CSS 박스 모델을 이해하고 설명할 수 있다. ⭕️

: 아주 기초적인 이해만 했을 뿐이다. 

• MDN, W3C School 등의 레퍼런스 사이트를 이용해 CSS 속성을 검색하고 사용할 수 있다.🔺

: 이건 복습하면서 해봐야 할 것 같다. 몇 번 더 해봐야 알 수 있을 것 같기 때문이다. 

 

 

---

3. 돌아보기

🔥 오늘의 마무리

: HTML과 CSS의 개념을 설명할 수 있고, 기초적인 구조 설명 수업은 따라가기에는 어려움이 없었다. 수업 자료에 링크된 페이지로 들어가 구현하는 것보다 내가 가지고 있는 VScode로 만들어 페이지를 구현하여 들어가는 것이 훨씬 이해하기 편했다. 그래서 모든 코드들을 일일히 쓰며 구현해보다 보니 속도가 많이 느려졌다. 내일부터는 8시부터 그냥 클래스의 수업을 조금씩 해보는 게 좋을 것 같다는 생각을 했다.

또한 CSS selector와 Box Model 파트에 오니 조금 이해하기 어려웠다. 특히 Box Model의 구성요소 같은 경우, 다시 한 번 천천히 따라서 복습해보니 전보다는 이해가 되었다. 하지만 아직 content-box와 border-box가 명확히 이해되지는 않았다. 구글링을 더 해보고도 어렵다면, 내일 오전 시간에 박스 모델을 복습한 후 질문을 해야겠다.

 

그리고 VScode로 오늘 배웠던 것들을 바탕으로 따라 만들어보고, 링크 예제 문제도 해봐야겠다.