728x90 Frontend/HTML, CSS16 [HTML, CSS] form 태그 태그는 사용자로부터 입력을 받을 때와 입력한 데이터를 서버로 보낼 때 사용합니다. 태그의 기본적인 형식은 다음과 같습니다.- action 속성은 태그를 통해 입력된 데이터를 어디로 보낼지 명시힙ㄴ;다. 이 URL은 2가지 값이 가능한데, ① 절대 주소를 활용한 다른 웹사이트 주소 또는 ② 상대 주소를 활용한 서버 상의 스크립트 파일(form-handler)의 주소입니다. - method 속성은 입력된 데이터를 서버에 전달할 방식을 명시힙ㄴ;다. 가능한 방식으로는 GET과 POST가 있습니다. * GET : 값을 가져온다는 이유로 "get"이라는 이름을 가지고 있으며, 데이터를 URL 변수에 담습니다. URL 자체에 포함이 되기 때문에 사용자가 기록하기가 쉽습니다. 하지만 URL 자체의 길이에.. 2022. 10. 8. [HTML, CSS] ID와 CLASS의 개념 ① .class에 대해서HTML에서 class 속성은 HTML 요소가 포함되는 클래스를 명시하기 위해 사용됩니다. 클래스를 지정함으로써 같은 스타일을 여러 HTML 요소들에 쉽게 적용할 수 있습니다. CSS 속성을 정의할 때 특정 클래스를 선택하려면, 클래스 이름 앞에 점 (.) 하나를 붙이면 됩니다. 클래스 이름은 알파벳으로 시작해야 되며, 화이트스페이스는 이름에 포함될 수 없습니다.HTML 요소는 두 개 이상의 클래스에 포함 될 수 있는데, 이 때는 클래스를 정의할 때 띄어쓰기로 구분하면 됩니다.Multiple class ② #id에 대해서HTML에서 id 속성은 하나의 특정 HTML 요소를 지정할 때 사용합니다. CSS 속성을 정의할 때 특정 아이디를 선택하려면, 아이디 이름 앞에 샵 (#)을 붙이.. 2022. 10. 1. [HTML/CSS] 시맨틱 태그 (Semantic Tag) 시맨틱 태그(Semantic Tag)의 사전적 정의는 "의미가 있는 태그"입니다. 의미가 있는 태그란 태그 이름으로부터 어떤 내용을 가지고 있는지 유추할 수 있는 태그입니다. , : 의미가 없는 태그 , , : 의미가 있는 태그 ▶ 시맨틱 태그의 장점 ① 검색 엔진 최적화 (SEO : Search Engine Optimization) 검색 엔진은 여러 웹페이지들의 자료를 수집하고 웹페이즈를 색인화합니다. 이 때, 웹페이지는 시맨틱 태그를 이용함으로써 검색 엔진에게 더 많은 정보를 제공할 수 있습니다. 검색 엔진은 검색 키워드를 기준으로 검색 결과들의 순위를 조정할 때 더 많은 정보를 제공하는 웹페이지에 높은 우선 순위를 부여합니다. 우선 순위를 바탕으로 검색 결과가 정렬되기 때문에 시맨틱 태그를 적절히 .. 2022. 9. 14. [HTML/CSS] 기본 레이아웃 웹페이지에는 여러가지 구성요소들이 존재합니다. 이 구성요소들을 적절히 배치하는 것이 레이아웃입니다. 좋은 레이아웃을 가진 웹페이지는 미학적으로 아름다울 뿐더러, 사용자에게 정보를 명확하게 전달하기 때문에 레이아웃은 매우 중요하다고 볼 수 있습니다. HTML은 여러 시맨틱 태그(semantic tag)들로 웹페이지의 특정 부분들을 정의하고 있습니다. 문서나 섹션의 가장 첫 부분으로, 헤더를 정의한다. 문서의 다른 부분으로 이동할 수 있는 링크들의 집합이다. 구역화된 부분을 나타낸다. 문서와 독립적인 글 부분을 나타낸다. 페이지 부분 이외의 부분을 나타낸다. 헤더와 반대로 문서와 섹션의 가장 마지막 부분으로, 푸터를 정의한다. 레이아웃을 구성하는데에는 약 4가지 방법이 있습니다. 1. CSS 프레임워크 사용.. 2022. 9. 13. 이전 1 2 3 다음 반응형
