본문 바로가기

클라이언트/HTML
(7)
HTML 태그 - <form> - Form 태그는 설명이 길어서 글을 따로 뺐다. // 폼, Form - 입력 양식, 입력 컨트롤 - 클라이언트(사용자)로부터 입력장치(키보드, 마우스 등)를 통해서 데이터를 입력받는 역할 - 입력 데이터 > 서버로 전송 > 업무 활용 or DB 저장 등 - 모든 입력 컨트롤을 감싸는 컨테이너 - 입력값을 서버로 전송하는 역할 - 렌더링 결과 없음 > 눈에 보이지 않음 - 속성 ~ method: 데이터를 전송하는 방식 1. get - 전송되는 데이터를 URL에 붙여서 전송하는 방식 - 편법 - 전송되는 데이터가 주소창에 노출됨 > 보안 문제 有 - 노출되면 안 되는 데이터는 절대로 get 방식으로 전송하면 안 된다. - URL(최대 256자, 65535byte) > 넘어가면 Overflow > 짤림 >..
HTML 블록, 인라인 - 모든 태그는 위의 두 분류 중 하나에 속한다. - 렌더링(Rendering, 태그를 화면에 출력하는 작업) 규칙이 서로 다르다. //블록 레벨 요소, Block Tag - 자신의 내용물과 앞뒤의 다른 태그의 내용물을 다른 라인에 출력한다. - 내용물의 크기와 상관없이 한 라인을 독점한다.(너비 100%) 높이는 내용물의 크기와 동일하다. - 엔터를 치지 않아도 줄바꿈이 된다. - 간격을 조절할 때 사용 금지★ > margin을 사용한다. ~ div, h1~h6, p, ul, li, table 등 //인라인 레벨 요소, Inline tag - 자신의 내용물과 앞뒤의 다른 태그의 내용물을 같은 라인에 출력한다. - 내용물의 크기가 태그의 영역이다. - 엔터를 치지 않으면 한 줄로 나타난다. - PCDAT..
HTML 시멘틱 마크업 //시멘틱 마크업, Semantics - 코드를 브라우저가 잘 이해할 수 있도록 하는 것 - 의미에 맞는 태그, 요소를 사용한다. - 문서를 표현할 때는 구조화를 잘 해준다. 굵은 vs 중요한 기울어진 vs 강조하는 밑줄친 vs 새롭게 추가된 중간선이 있는 vs 삭제된 //HTML5에서 새로 생긴 Sematic 요소 - : 사이트 내에서 독립적으로 구분함. - : 사이트내에서 독립적으로 구분 + 더 적합한 의미를 가진 요소가 없을 때 사용함. - : 문서의 주요 내용과 간접적으로 관련이 되는 부분을 표현함. - : figure 콘텐츠에 대한 설명을 나타냄. - : 이미지, 도표 등 독립적인 콘텐츠를 표현함. - : 작성자, 관련 문서, 저작권 내용 등을 표현함. - Java Oracle HTML CSS ..
HTML 콘텐츠 모델 //콘텐츠 모델, Contents Model - html5에서 html 요소들이 가지고 있는 성격에 따라 요소의 종류를 정의하는 규칙들을 그룹화한 것 1. Metadata Content - 콘텐츠의 스타일(표현), 동작(스크립트)을 설정하거나 다른 문서와의 관계 등 정보를 포함하는 요소들이 포함된다. - 대부분 내에 들어간다. ~ base, link, meta, noscript, script, style, title 2. Flow Content - 문서의 자연스러운 흐름에 의해 배치되는 요소들이 포함된다. - 문서에 사용되는 요소 대부분 ~ a, abbr, address, map>area, article, aside, audio, b, bdo, blockquote, br, button,canvas, ci..
HTML 태그의 종류 // Paragraph - 문단 태그 - 문단을 표현(=텍스트 집합) - 쌍태그(문단의내용) - 혼합용(텍스트 + 자식 태그) ※ align 속성 ~ align="left|center|right|justify" : 내용물의 수평 정렬 - horizontal alignment ~~ left: 왼쪽 정렬 ~~ center: 가운데 정렬 ~~ right: 오른쪽 정렬 ~~ justify: 양쪽 정렬 서울특별시 강남구의 법정동. 강남권의 대표적인 사무실 밀집지역이자 유흥의 중심지로 유명하다. 북쪽으로 봉은사로, 동쪽으로 선릉로, 남쪽으로 도곡로, 서쪽으로 강남대로를 통해 다른 동과 접한다. 이 중 북쪽으로 테헤란로, 동쪽으로 선릉로, 남쪽으로 도곡로, 서쪽으로 논현로를 범위로 하는 구역은 역삼2동에, 나머지 구..
HTML 문법 - 하이퍼텍스트 마크업 언어 - 프로그래밍 언어 X - 프레젠테이션 언어 > 무엇인가를 표현하는 기능을 가지는 언어 - Hyper Test > 링크 - Markup Langauge > 언어 표기법 : ~ SGML > 모든 마크업 언어의 시조 ~ HTML > 표현 언어 ~ XML > eXtensible Markup Language > 데이터 통신 or 저장(CSV) - XHTML > XML + HTML - W3C, World WIde Web Consortium - https://w3.org - HTML 1.0 ~ HTML 5 - HTML 4.01, XHTML 1.0, HTML5 ~ HTML 4.01: 가장 대중화된 버전(웹을 활성화시킴) ~ XHTML 1.0: XML + HTML > 문법 강력하게 준수 ~..
Visual Studio Code 프로그램 설치 및 기본 기능 익히기 - Visual Studio Code https://code.visualstudio.com/download Download Visual Studio Code - Mac, Linux, Windows Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. Download Visual Studio Code to experience a redefined code editor, optimized for building and debugging modern web and cloud applications. code.visualstudio.com - 한국어 버전을 선택하여 재시작하였다. // 자동 완성..