aside 🧙🏼 HTML 구조를 나타내는 요소 : 컨텐츠 분할 요소 : 블록 레벨 요소 : 플로우 콘텐츠를 위한 통용 컨테이너 (순수 컨테이너로서 아무것도 표현안함) : 인라인 컨테이너 : 인라인 레벨 요소 🌵 span (인라인 요소) vs div(블록 요소) Semantic Web : 요소의 의미를 고려하여 구조를 설계하고 코드를 작성한다. (div, span : non-semantic) : 제목, 로고, 검색, 폼, 작성자 이름등의 ... spanHTML 구조articleheadersectionmainhtmlnavdivasidefooterHTML 구조 버튼 정렬은 aside 태그를 생성해서 정렬! 단순히 body 안에 버튼들을 생성하고 style에 를 입력하면 버튼들은 위에 고정되지만(fixed) 버튼들끼리 서로 겹쳐있는 상태를 볼 수 있다. 그러나, body 안에 aside 태그를 생성하고 그 안에 button들을 집어넣은 뒤 style에 를 입력하면 생성된 버튼들이 위에 고정되면서(fixed) 우측으로(1000px만큼) 정렬되는 모습을 볼 수 있다.... asideCSStaghtmlCSS
🧙🏼 HTML 구조를 나타내는 요소 : 컨텐츠 분할 요소 : 블록 레벨 요소 : 플로우 콘텐츠를 위한 통용 컨테이너 (순수 컨테이너로서 아무것도 표현안함) : 인라인 컨테이너 : 인라인 레벨 요소 🌵 span (인라인 요소) vs div(블록 요소) Semantic Web : 요소의 의미를 고려하여 구조를 설계하고 코드를 작성한다. (div, span : non-semantic) : 제목, 로고, 검색, 폼, 작성자 이름등의 ... spanHTML 구조articleheadersectionmainhtmlnavdivasidefooterHTML 구조 버튼 정렬은 aside 태그를 생성해서 정렬! 단순히 body 안에 버튼들을 생성하고 style에 를 입력하면 버튼들은 위에 고정되지만(fixed) 버튼들끼리 서로 겹쳐있는 상태를 볼 수 있다. 그러나, body 안에 aside 태그를 생성하고 그 안에 button들을 집어넣은 뒤 style에 를 입력하면 생성된 버튼들이 위에 고정되면서(fixed) 우측으로(1000px만큼) 정렬되는 모습을 볼 수 있다.... asideCSStaghtmlCSS