본문 바로가기

HTML37

웹 페이지 구성을 위한 HTML <section> 태그 SECTION 태그란? HTML에서 section 태그는 웹 페이지의 구획을 나누는 데 사용됩니다. 이렇게만 얘기하면 무슨 소리지? 라고 생각될텐데요. 저도 이런 태그는 있으나 없으나 똑같은 것 아닌가? 라고 생각했습니다. 그런데, 검색엔진은 이런 구획 나누는 태그를 좋아한다고 하네요. 시맨틱 구조이기 때문이죠. 안에 가 들어가고, 안에 이 들어가겠죠? 은 안에 들어가는 태그입니다. 사용법 컨텐츠가 A 내용, B 내용으로 구분된다면 각각 태그로 그룹핑합니다 예시 소개 회사 소개 내용... 서비스 서비스 1 서비스 2 서비스 3 위의 코드에서는 첫 번째 section 태그에는 "소개"라는 제목과 회사 소개 내용이 포함되어 있습니다. 두 번째 section 태그에는 "서비스"라는 제목과 목록 형태로 서비스 .. 2023. 5. 31.
HTML 리스트 생성 <ol> 태그 - 순서가 존재하는 목록 생성 OL 태그란? OL (Ordered List) 태그는 정렬된 목록을 생성하는 도구입니다. 태그가 마커로 정렬하는 것과 달리 은 순서대로 정렬하는 태그입니다. 기본값은 숫자이지만 알파벳을 이용할 수도 있지요. 태그 역시 li (List) 태그와 항상 함께 다닙니다. 사용법 List 1 List 2 List 3 태그를 엽니다. 앞으로 순서가 존재하는 리스트를 만들거라고 선언한거죠 다음 줄에 들여쓰기를 한 뒤 태그를 만듭니다. 원하는 만큼 만들면 됩니다. 태그 사이에 원하는 목록을 추가합니다. 태그를 써서 닫습니다. 예시 See the Pen OL by 40's Programmer (@40sProgrammer) on CodePen. UL 태그의 속성 ol 태그에서 자주 사용하는 2가지 속성 type, star.. 2023. 5. 30.
사용자의 상호작용을 위한 버튼을 만들자 HTML <button> 태그 BUTTON 태그란? 태그는 사용자가 클릭해서 이벤트를 발생시킬 수 있는 버튼을 만드는 태그입니다. 사용법 클릭하세요 button은 쌍으로 존재하는 태그입니다 사이에 text를 입력합니다 예시 See the Pen Untitled by 40's Programmer (@40sProgrammer) on CodePen. 간단하게 누를 수 있는 버튼을 만들었습니다. BUTTON 태그의 다양한 속성 태그는 3가지 주요 속성을 지닙니다. 사용법 2023. 5. 30.
HTML 리스트 생성 <ul> 태그 - 순서없이 마커로 목록 생성 UL 태그란? UL (Unordered List) 태그는 목록을 생성하는 도구입니다. 우리가 흔히 볼 수 있는 리스트 앞에 점이 찍힌 형태에요. 태그는 LI (List) 태그와 항상 함께 다닙니다. 사용법 List 1 List 2 List 3 태그를 엽니다. 앞으로 순서없는 리스트를 만들거라고 선언한거죠 다음 줄에 들여쓰기를 한 뒤 태그를 만듭니다. 원하는 만큼 만들면 됩니다. 태그 사이에 원하는 목록을 추가합니다. 태그를 써서 닫습니다. 예시 See the Pen UL by 40's Programmer (@40sProgrammer) on CodePen. UL 태그의 속성 원래 아래 속성들이 있었는데 HTML5부터는 사용하지 않는다고 하네요. 대신 CSS에서 조정한다고 합니다. type : 앞에 마커 형.. 2023. 5. 29.

티스토리툴바