[패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 21회차 미션

시작한 지 3주째!

패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 21일차입니다!

오늘 6번째 커리큘럼을 완료했습니다. 인라인 텍스트와 관련된 HTML 요소 강의를 들었는데요.

지난 주와 이번 주에 걸쳐서 블록 요소와 인라인 요소에 대하여 학습하여 한층 레벨업한 기분이에요! 🏃🏻‍♂️

 

오늘 강의를 들으면서, 예전부터 강사님께서 강조해온 것이지만 화면의 구조만 HTML로 작성하고,

꾸미는 영역은 모두 CSS 스타일링으로 돌려야 한다는 말이 특히 생각납니다.

띄어쓰기나 줄바꿈을 할 때 &nbsp; 나 <br> 태그를 남발했던 지난 날을 떠올리며 열공했어요. 😂

---

<Today I Learned>

<sup>

🔸 위 첨자 표시

<sub>

🔸 아래 첨자 표시

 

<time>

🔸 날짜, 시간을 나타내기 위한 태그, IE 지원 X

🔹 속성: datetime, 유효한 날짜를 yyyy-mm-dd 값으로 나타냄

 

<span>

🔸 아무것도 나타내지 않는 콘텐츠 영역 표시

🔸 텍스트를 다루는 것에 특화됨, CSS style을 통해 자유자재로 꾸밀 수 있음

 

<br />

🔸 BReak, 빈 태그

🔹 <br> 태그를 여러 개 사용하여 줄바꿈 간격을 넓히는 행동은 하지 말기!!!

    ➡ HTML은 구조 생성을 위한 것이기 때문에 꾸미는 것으로는 CSS로 컨트롤 하기

    ➡ 간격을 넓히고 싶을 땐 문단을 <p> 태그로 묶고 line-height 속성으로 컨트롤

---

- 수정 태그

<ins>

🔸 원래 없었음, 현재 추가된 단어

🔸 새로 추가된 텍스트 범위를 나타냄

🔸 기본 표시: 밑줄

 

<del>

🔸 현재 제거된 상태, 원래 존재했음

🔸 삭제된 텍스트 범위를 나타냄

🔸 기본 표시: 중앙선

 

🔹 공통 속성: cite - 변경 설명하는 리소스의 URI를 값으로 가짐 / datetime - 언제 변경되었는지 명시

---

학습 내용 출처: https://heropy.blog/2019/05/26/html-elements/

한눈에 보는 HTML 요소(Elements & Attributes) 총정리

강의 링크: https://bit.ly/3m0t8GM