HTML 5

[HTML] Form 태그 종류 및 개념정리

1. form 폼의 뜻은 정보를 기입하는 부분이 있는 문서를 뜻한다. 따라서 HTMl에서 form은 사이트의 방문자에게 정보를 수집할 수 있는 태그들이다. HTML에서는 다양한 유형의 태그들로 사용자로부터 정보를 수집한다. form의 동작 방식 (1) 사용자가 폼을 입력한 후 submit하면 정보가 웹서버에 전송된다. (2) 웹서버는 정보를 처리하고 대부분 정보는 데이터베이스(DB)에 저장된다. (3) DB에서 CRUD 작업이 일어나고 작업 결과를 APP으로, WEB으로 전송합니다. (4) 서버는 수신한 정보를 브라우저로 보낼 새로운 페이지를 만든다. 2. - 태그에는 action 속성과 method 속성 id 속성을 쓸 수 있다. action - action="url"의 형태로 쓰이며 폼에 있는 정보를..

[HTML] Text-level Tag 모음

1. - 같이 아무 의미 없는 태그이다. 쓸만한 태그가 없을 때 쓰는 최후의 수단. HTML 삽입 미리보기할 수 없는 소스 2. , 화학기호나 수학공식같은 첨자를 이용할때 사용 글자로 특정 글자를 작아지게 하기 위해서는 사용하지 않는다. - : 문자 하단에 첨자 - : 문자 상단에 첨자 HTML 삽입 미리보기할 수 없는 소스 3. , , , , - : 준말, 약자를 나타내고 싶을 때 사용하는 태그이다. 속성 값으로 title="원하는 단어"를 사용하고, 해당 태그로 감싸면 문자 하단에 점선이 생기고 그곳에 커서를 올려두면 title에 써놓은 단어가 표시된다. 보통 단독으로 쓰이지만, 태그에도 사용된다. - : 현재 문맥에서 정의하고 있는 용어를 나타낸다. dfn의 가장 가까운 부모가 혹은 쌍, 요소일 경..

[HTML] Grouping Content 모음

HTML 일반적인 구조 HTML Grouping Content 종류 1. , , 태그 아침 점심 간식 저녁 아침 점심 간식 저녁 결과 리스트, 메뉴 등을 나열 할때 사용 가능하다 태그는 순서가 있는 목록에 사용되며 숫자가 매겨지고 은 순서가 없는 목록에 사용되며 특수문자가 매겨진다. 는 또는 요소 안에서만 사용되어야 한다. 를 사용하면 로마자로 표기할 수 도 있다. 2. , , 한글 대한민국에서 사용하는 언어입니다. a는 b이다. 등 정의할 수 있는 정의 할 수 있는 상황에 사용 가능한 태그이다. 에는 하나 이상의 또는 가 포함되고 있어야 하고 div, dt, dd를 제외한 다른 태그를 포함하면 안 된다. 3. 레이아웃을 나눌 때 사용되지만 태그의 의미를 부여할 수 있다면 다른 태그들을 먼저 고민해보고 ..

[HTML,CSS,JavaScript] jQuery 섹션 이동 버튼 만들기, 원하는 태그로 이동 하는법

1. jQuery cdn을 입력하여 jQuery 라이브러리 가져오기 head 사이에 cdn을 입력하여 라이브러리를 가져온다. 2. 섹션 이동 함수 코드 작성 body 태그 사이에 위의 script 코드를 작성해준다. 3. 예제 html 섹션1 섹션2 섹션3 섹션4 section1 section2 section3 section4 css #section1 { background-color: skyblue; height:500px; margin:20px; } #section2 { background-color: yellow; width: 100%; height:500px; margin:20px; } #section3 { background-color: pink; width: 100%; height:500px;..

HTML, CSS 수평배치와 줄넘김하는 방법, flex와 flax-wrap 사용법

1. 수직적인 기본구조 html, css의 기본적인 레이아웃 구조는 수직으로 쌓인다.(위에서 아래로) 하지만 flex를 쓰면 레이아웃이 쌓이는 것을 수평으로 쌓을 수 있다. 2. flex 예제 1) 기본적인 구조 (수직) 위 그림과 같이 기본적으로 박스들이 수직으로 쌓인다. - HTML 코드 BOX1 BOX2 BOX1 BOX2 container라는 속성 값을 가진 div 안에 firstbox와 secondbox라는 속성 값을 가진 div들을 입력 div는 기본적으로 block 요소이기 떄문에 수직으로 쌓인다. - CSS 코드 .container { background-color: darkgray; } .container .firstbox { width: 100px; height: 100px; backgr..