[Publishing]HTML, CSS / 2일차 기록

프론트엔드 개발자와 백엔드 개발자가 협업을 하기 위해서는 서로 상대방의 기본 지식을 알아야 함

• https://www.w3schools.com/

1. HTML

• 정의: HyperText Markup Language,웹 문서 구조를 표현하는 언어 
• 기본 구조/문법: 태그들의 집합, html, head, body, h1,div(줄바꿈 O), span(줄바꿈 X)
• 시맨틱 태그
  • 의미있는 태그
  • 이점: 애플리케이션, 기업 및 커뮤니티에서 데이터를 공유하고 재사용 가능
  • ex) <header>, <nav>, <section>, <article>, <aside>, <footer>

2. CSS

• 정의: 웹 페이지 스타일 및 레이아웃을 정의하는 스타일시트 언어
• 이점: 사용자에게 편의성 제공
• 기본적인 문법과 구조
  • 태그이름 { 속성; }
  • 셀렉터(id, class, attribute, 후손 <, 자식, 인접 형제 +, 부정 등)
  • ex)

main, aside{
	font-size: large; 
    background: #fff; /* 배경색 */	
    color: #f9f9f9; /* 폰트색 */
    text-align: left;
    padding: 1em 0.3em; /* 컨텐츠와 border 사이 간격 */
}

• 박스모델 
  • 웹 페이지 내의 콘텐츠의 고유 영역
  • block vs. inline
  • 박스 구성 요소: Margine, Border, Padding, Content