HTML
input 태그의 type 속성 종류와 예제
input 태그의 type 속성 종류와 예제
2021.01.21HTML에서 양식을 만들 때, form 태그를 사용하고, input 태그를 통해 입력 영역을 만듭니다. 입력 영역의 종류는 다양하며 type 속성의 값에 따라 동작 방식이 현격히 달라집니다. 특성을 지정하지 않는 경우 기본값은 text입니다. input 태그의 type 속성값 속성 설명 text 기본값으로 한 줄의 텍스트 입력 칸을 만듭니다. (기본 너비 문자는 20입니다.) password text 속성과 같지만, 입력 문자를 별표(*)로 대체해서 표시합니다. checkbox 선택 항목 중 여러개를 선택할 수 있는 체크박스를 만듭니다. radio 선택 항목 중 1가지만 선택 가능한 라디오 버튼을 만듭니다. button 누를 수 있는 기본 버튼을 만듭니다. submit 전송 버튼을 만듭니다. reset ..
[HTML] 🤔 HTML이란?
[HTML] 🤔 HTML이란?
2020.01.11🤔 HTML이란? HTML은 웹페이지를 만들기 위한 하이퍼텍스트 마크업 언어(HyperText Markup Language, 문화어: 초본문표식달기언어, 하이퍼본문표식달기언어)라는 의미의 웹 페이지를 위한 지배적인 마크업 언어다. HTML은 다음과 같은 특징을 가지고 있다. HTML은 태그를 통해 웹 페이지의 구조를 알려준다. HTML은 다양한 요소들로 이루어져있다. HTML은 브라우저에게 어떤 것이 보여질 지를 알려준다. HTML은 태그를 통해 표현된다. HTML 태그는 머릿말, 문단, 표 같은 것들을 라벨링한다. 📄 간단한 HTML 문서 첫 머릿말 첫 문단 해당 문서의 의미는 다음과 같다. 라는 선언은 해당 문서가 HTML5라는 것이다. 요소는 HTML 페이지의 root 요소이다. 요소는 문서에 대한..
[JavaScript] Ajax
[JavaScript] Ajax
2019.12.11웹 어플리케이션의 사용성은 데스크톱 어플리케이션에 비해 현저히 떨어져있었다. 고전적인 웹 어플리케이션 유저가 폼 영역을 채우고 폼을 제출한다. 브라우저가 서버에게 보낼 요청을 생성한다. 서버가 브라우저가 렌더할 정확한 페이지를 포함한 응답을 생성하고 보낸다. 브라우저가 새로운 페이지를 로드하고, 잠시 브라우저의 윈도우가 깜빡거린다. 클라이언트는 서버의 답을 기다리고 전체 페이지를 새로운 데이터로 다시 로드한다 동기적인 요청이 서버에서 처리되는 동안, 유저는 클라이언트 웹 브라우저와 상호작용할 수 없다. 동기적 모델은 하이퍼텍스트 문서들의 웹을 위해 고안되었다. Ajax 웹 어플리케이션 Ajax 어플리케이션에서, 유저는 페이지와 상호작용한다. 클라이언트는 요청을 처리하기 위해 XMLHttpRequest라는..
[HTML] HTML DOM(Document Object Model)
[HTML] HTML DOM(Document Object Model)
2019.11.27HTML DOM(Document Object Model)이란? DOM은 W3C(World Wide Web Consortium) 표준으로 DOM은 문서를 접근하기 위한 표준을 정의합니다. W3C DOM은 프로그램들과 스크립트들이 콘텐츠나 구조, 문서의 스타일에 동적으로 접근하고 수정하기 위한 플렛폼이자 언어 중립적 인터페이스입니다. W3C DOM 표준은 3개로 나뉘어져 있습니다. Core DOM - 모든 문서 종류에 대한 표준 모델 XML DOM - XML 문서에 대한 표준 모델 HTML DOM - HTML 문서에 대한 표준 모델 DOM은 문서의 구조화된 표현 제공을 통해, 프로그래밍 언어가 DOM구조에 접근할 수 있는 방법을 제공하여 그들의 문서 구조 및 스타일이나 내용등을 변경할 수 있게 합니다. 우리..
[HTML] 시맨틱(Semantic) HTML을 짜보자
[HTML] 시맨틱(Semantic) HTML을 짜보자
2019.02.12시맨틱(semantic) HTML?시맨틱(Semantic) HTML을 직역하면 의미론적 HTML이 됩니다. 아직도 뭘 의미하는 건지 모르겠죠? 의미론적이란 언어에서 단어와 구절의 의미를 아는 것을 뜻합니다. Semantic elements란 의미를 가진 elements를 뜻하죠. HTML에서 semantic element는 해당 element의 의미를 브라우저와 개발자 모두에게 알려줄 수 있습니다. 시맨틱하지 않은(non-semantic) elements의 예시 와 이 있습니다. 이 element는 내용물에 대한 어떠한 것도 알려주지 못합니다. 와 으로만 이루어진 코드는 실제 돌아가긴 하겠지만, 나중에 내용물에 대한 어떤 정보도 알 수 없게 됩니다. 시맨틱한(semantic) elements의 예시 , ..
[JavaScript] 🖼️ JavaScript로 Flexbox를 이용한 이미지 갤러리 만들기
[JavaScript] 🖼️ JavaScript로 Flexbox를 이용한 이미지 갤러리 만들기
2019.02.05🖼️ Day5 - JavaScript로 Flexbox를 이용한 이미지 갤러리 만들기JavaScript 30의 다섯 번째 프로젝트는 Flexbox를 이용한 이미지 갤러리 만들기 프로젝트이다. 😊 HTML 코드123456789101112131415161718192021222324252627282930313233343536373839404142434445 Flex Panels 💪 Hey CAT Dance Give CAT Receive Experience CAT Today Give CAT You can Life CAT Motion Colored by Color Scriptercs🎨 CSS 코드1234567891011121314151617181920212223242526272829303132333435363738..