html13 [HTML] <form> 태그 0. 개요 1. 태그의 정의 2. 태그의 속성 ① name 속성 ② target 속성 ③ action 속성 ④ method 속성 (1). GET 방식 (2). POST 방식 3. 4. 마치며 0. 개요 위의 이미지는 통계에 따른 HTML 각 태그의 사용률 순위를 나타낸 이미지이다. 이번 게시글에서 다루는 것은 현재 57.3%의 사용률을 가진 태그에 관한 것이다. 요소의 예제에 , 와 같은 입력 요소를 같이 사용했기 때문에 해당 태그에 대해 잘 모르겠다면 하단의 링크를 참고하길 바란다. (, , 세 가지의 입력 요소에 대해 정리해 둔 게시글이다.) 내용적으로도 이전 게시글에서 다룬 입력 요소와 연관됐기 때문에 어느 정도 도움은 될 것이라고 생각한다. HTML 삽입 미리보기할 수 없는 소스 1. 태그의 정의.. 2023. 5. 14. [HTML] 입력 요소 3가지 (<input>, <select>, <textarea>) 1. ① type 속성 ② name 속성 ③ value 속성 2. 3. 1. 요소란 사용자로부터 값을 입력받을 수 있는 입력창을 만드는 요소이다. 해당 요소는 기본적으로 인라인 블록을 만드는 인라인 요소이며, 별도의 닫는 태그가 없는 단일 태그이다. 요소는 'type' 속성의 값에 따라 입력 요소의 형태를 다르게 할 수 있으며 추가적으로 'name' 속성을 통해서 각 입력 요소에 대해 식별자를 추가할 수 있다. ① type 속성 type 속성은 요소의 핵심적인 속성으로 해당 속성의 값에 따라 입력창의 형태와 입력할 값의 유형이 달라지고 거기에 맞춰서 추가로 적용할 수 있는 속성의 종류도 조금씩 차이가 생긴다. 해당 속성의 기본 값은 'text'로 아래의 예제를 보면 '이름' Part에 별도로 type을 .. 2023. 5. 5. [HTML] 시맨틱 태그 (Semantic Tag) 목차 시맨틱 태그 (Semantic Tag) ① 시맨틱 태그의 정의 ② 시맨틱 태그 종류 (1). (2). (3). (4). (5). (6). (7). 시맨틱 태그 (Semantic Tag) ① 시맨틱 태그의 정의 "Semantic"은 "의미의, 의미론적인"이라는 뜻을 가진 단어이다. 이번에 다루는 시맨틱 태그를 그대로 해석해 보자면, "의미를 가진 태그"라고 할 수 있다. 좀 더 쉽게 말하자면 앞에서 배운 와 같은 태그에 별도의 의미를 부여한 것이다. 상단의 이미지에서 빨간색 테두리로 감싼 , , 가 대표적인 시맨틱 태그이다. 시맨틱 태그는 HTML5에서 처음 등장하였으며, 각 태그의 명칭으로 사용된 단어의 뜻을 생각해 보면 는 웹 페이지의 상단부, 는 웹 페이지의 꼬리, 하단부라는 것을 쉽게 알 수 .. 2023. 4. 27. [HTML] 목록 만들기 (<ul>, <ol>, <li>) 1. 목록 태그 (, , ) ① 목록의 정의 ② ③ (1). type 속성 (2). reversed 속성 (3). start 속성 ④ 2. 마치며 1. 목록 태그 (, , ) ① 목록의 정의 목록이란 "연관 있는 항목들을 순서대로 나열한 것"을 말한다. HTML에서도 목록, List를 웹 페이지에 출력하고 싶은 경우 요소를 통해서 표현하고 싶은 콘텐츠, 텍스트를 목록의 형태로 표시할 수 있다. 그리고 이러한 목록도 순서 없이 표시하거나 혹은 순서대로 표시할 수도 있다. 순서가 없는 목록(Unordered List)은 , 순서가 있는 목록(Ordered List)은 요소를 통해서 표현할 수 있다. 아래는 , 요소를 통해서 목록을 표시한 예시이다. HTML 삽입 미리보기할 수 없는 소스 , , 태그 모두 블.. 2023. 4. 1. [HTML] <a> 요소 1. 태그 ① 태그의 정의 - a => anchor의 약어, '닻', '정박지'라는 의미를 가지고 있다. - 같은 문서 내에서 혹은 다른 문서로의 이동을 위해서 사용되는 태그로 인라인 요소를 만드는 인라인 태그이다. - 'href' 속성을 통해서 문서 내의 특정 위치, 파일, 이메일 주소 등 다른 URL로 연결된 하이퍼 링크를 만들 수 있다. 하이퍼 링크(Hyperlink) 클릭하면 현재 문서 내에서 특정 부분으로 이동하거나 혹은 다른 문서로 이동할 수 있는 수단 줄여서 '링크'라고도 한다. - 'target' 속성을 통해서 현재 문서에서 새로운 문서로 이동할 때 새로운 문서를 현재 탭에서 열지 아니면 새로운 탭에서 열지에 대한 여부를 설정할 수 있다. ② href 속성 - href => Hypertex.. 2023. 3. 29. [CSS] 선택자 1 (기본, 그룹 선택자) 목차 1. 선택자 ① 선택자의 정의 ② 기본 선택자 (전체, 태그, Class, ID) (1). 전체 선택자 (Universal Selector) (2). 태그 선택자 (Type Selector) (3). Class 선택자 (Class Selector) (4). ID 선택자 (ID Selector) ③ 그룹 선택자 2. 마치며 1. 선택자 (Selector) ① 선택자의 정의 - 웹 페이지의 HTML 요소를 대상으로, CSS 스타일을 지정하려고 할 때 사용된다. (이번 장에서는 CSS 스타일을 지정하는 선택자 중 '전체', '태그', 'class', 'id', '그룹' 다섯 가지만 다루고, 나머지 선택자들은 추후에 다루도록 하겠다.) - 선택자에 의해 선택된 요소들은 '선택자의 주체'로 지정된다. [in.. 2023. 3. 24. 이전 1 2 3 다음
