안녕하세요 ?,

저는 경력 3년의 프론트엔드 개발자입니다. 나는 항상 내 지식의 격차를 해소하고 풀 스택 개발자가 되고 싶었습니다. 나는 Odin 프로젝트를 시작하려고 여러 번 시도했지만 지속적으로 완료하지 못했습니다. 이번에는 꼭 버티고 실력을 키워나가야겠다는 다짐을 하게 되었습니다.

진행 상황을 추적하기 위해 각 Odin 프로젝트 장에서 배운 내용을 자세히 설명하는 일련의 블로그 게시물을 게시할 예정입니다. 이것을 내 개발 일기로 생각하세요.

내가 배운 주제를 추가하고 이전에 몰랐던 내용을 공유하겠습니다.

CSS를 HTML로 시작하고 이전에 겪었거나 적어도 알고 있는 모든 입문 작업을 시작합니다.

배운 주제

• 선택기

1. 범용 선택기
2. 유형 선택기
3. 클래스 선택기
4. ID 선택기
5. 그룹화 선택기
6. 체인 선택기

• 결합자 나는 결합자를 사용하는 방법에 대해 알고 있었지만 그 특정 용어는 몰랐습니다. 또한 그룹화 또는 연결 이외의 선택기 간의 관계에 관한 정의입니다.
• 하강 결합자

기본 CSS 속성

• 색상, 배경색
• 타이포그래피

1. 글꼴 계열 및 일반 글꼴 계열

• 이미지 높이 및 너비
  그래서 제가 여기서 배운 또 다른 점은 HTML의 이미지에 항상 너비와 높이 속성을 모두 지정하는 것이 좋습니다. 이렇게 하면 페이지 렌더링 중에 브라우저가 이미지에 적절한 공간을 확보하여 이미지가 로드될 때 콘텐츠 레이아웃이 예기치 않게 이동하는 것을 방지할 수 있습니다. 이미지의 원래 가로 세로 비율을 유지하려면 너비 속성만 변경하고 높이를 '자동'으로 설정하면 됩니다. 그러면 이미지 비율에 따라 높이가 자동으로 조정됩니다.

• 외부 CSS

• 내부 및 인라인 CSS

기술 책임자가 HTML에 인라인 CSS를 추가한 사례가 기억납니다. 나는 그의 결정에 의문을 제기하는 것을 망설였습니다. 왜냐하면 그는 노련한 전문가였고 나는 아직 이 분야에 비교적 초보였기 때문입니다.

그러나 이제 인라인 CSS 사용을 최소화하도록 제안하는 것이 더 효과적인 접근 방식이었을 것이라는 점을 이해합니다. 인라인 스타일을 규칙이 작동하는 데 꼭 필요한 스타일로만 제한함으로써 특정성을 과도하게 적용하는 것을 방지하고 더 깔끔하고 유지 관리하기 쉬운 코드베이스를 유지할 수 있습니다.

또한 제가 배운 내용을 요약하여 매주 팟캐스트를 발행할 계획입니다.