본문 바로가기
728x90

Programming

[01. HTML] 009. 추가 마크업 추가적으로 몇 가지 중요한 마크업(태그 등을 이용하여 문서나 데이터의 구조를 명기)에 대해 알아보자. 기본적으로 HTML5를 사용하기 위해서는 코드의 가장 위에 을 선언한다 이는 HTML5를 사용하기 위해 필수적인 것은 아니나 다른 버전과 구별하기 위해 사용된다. 앞에서도 잠깐 언급되었지만 id속성을 사용하여 특정 요소의 스타일이나 동작을 제어할 수 있다. id값은 하나만 사용할 수 있으며 절대 겹치면 안된다. 반면에 class속성은 같은 class를 동시에 제어할 수 있다는 점에서 id와 다르다. 앞에서 사용된 텍스트와 요소들을 하나의 블록으로 그룹화하기 위해서 를 사용한다. 그룹화하여 요소들을 그룹단위로 제어하면 편리하다. 블록단위는 항상 새로운 줄에서 시작한다면 나란히 묶어주는 인라인으로 그룹화하기.. 더보기
[01. HTML] 008. 폼 폼은 방문자로부터 정보를 수집하는 데 사용된다. ID나 패스워드를 폼을 통해 입력받아 로그인을 하거나 라디오 버튼, 체크박스, 드롭다운 박스 등으로 사용자에게 몇 가지 범위내에서 선택할 수 있는 기능을 제공할 수도 있다. 폼의 기본적인 구조는 요소를 사용하여 다음과 같다. ID action 속성은 정보를 전달할 서버의 url이다. method는 get과 post 두 가지 전달방식이 있는데 get은 url창에 정보가 노출된다. 하지만 post방식은 http 헤더에 추가하여 전송하기 때문에 비밀번호 등 노출되면 안되는 정보를 전송할 때 사용된다. 요소를 추가하여 최대 길이 30글자의 텍스트를 username의 이름으로 입력받는다. 만약에 password처럼 화면에 나타나서는 안되는 정보는 type=”pass.. 더보기
[01. HTML] 007. 테이블 테이블의 기본 구조는 다음과 같다. 머리말 머리말 머리말 데이터 데이터 데이터 데이터 데이터 데이터 은 table row의 약자다. 테이블의 행을 추가할 때 사용한다. 그리고 는 table data의 약자다. row안에 data를 삽입할 때 사용한다. 는 table heading의 약자다. 요소와 비슷하게 사용되나 머리말을 나타내는 점이 다르다. 테이블의 모습이 어딘가 조금 이상하다. 테두리가 현재는 없는 상태이다. 추후에 CSS를 이용해 테두리를 넣는 방법을 알아보기로 한다. 테이블의 열병합과 행병항은 colspan과 rowspan으로 할 수 있다. 머리말 머리말 머리말 데이터 데이터 데이터 데이터 보다 큰 데이터를 다룰 때에는 긴 테이블을 사용하는 경우가 많다. 긴 테이블은 , , 3가지 부분으로 구.. 더보기
[01. HTML] 006. 이미지 이미지를 추가하기 위해서는 요소를 사용한다. title 속성은 마우스를 가져가면 tooltip으로 나오는 설명이다. width와 height로 그림의 크기를 조정하며 alt는 이미지가 표시되지 않을 때 이미지에 대한 설명을 제공한다. 더보기
[01. HTML] 005. 링크 링크는 요소를 통해 생성할 수 있다. YOne Labs 그리고 새 창에서 링크를 열고자 한다면 다음과 같이 target 속성을 사용하면 된다. YOne Labs 그리고 추가적으로 href=”#id”를 통하여 id 속성을 지정한 요소로 이동하는 기능도 있다. 이는 스크롤이 많은 페이지에서 주로 top으로 가기위해 사용된다. 더보기
[01. HTML] 004. 목록 목록은 세 가지 유형이 있다. 각 항목에 번호가 매겨져 있는 순서있는 목록과 순서가 매겨져 있지 않는 순서 없는 목록, 그리고 각 용어에 대한 정의를 하는 정의 목록이 있다. 1) 순서있는 목록 순서있는 목록1 순서있는 목록2 순서있는 목록3 2) 순서없는 목록 순서없는 목록1 순서없는 목록2 순서없는 목록3 3) 정의 목록 정의 목록 정의 목록 내용 더보기
[01. HTML] 003. 텍스트 웹에 글자를 표시하는 방법에 대해 알아보자. 기본적으로 제목은 여섯 단계의 레벨이 있다. 메인 제목 2 레벨 제목 3 레벨 제목 4 레벨 제목 5 레벨 제목 6 레벨 제목 은 메인 제목으로 주로 사용되고 뒤로 갈수록 글자의 크기가 작아져 부제목 소제목 등으로 사용된다. 그리고 단락은 로 나타내며 하나 이상의 문장으로 구성된 이야기의 독립적인 단위를 형성한다. 항상 시작은 새로운 줄로 나타낸다. 단락은 하나 이상의 문장으로 구성된 이야기의 독립적인 단위 제목과 단락을 표현하는 방법에 대해 알아봤다. 다음으로 텍스트 모양을 변경하는 방법을 알아보자. 글씨를 굵게하는 방법은 로 하고, 기울임은 로 한다. 또한 위 첨자는 으로 나타내며 아래첨자는 으로 표현한다. 그리고 줄바꿈은 로 하고 가로줄을 추가하는 것은 .. 더보기
[01. HTML] 002. HTML구조 HTML은 요소를 사용해 페이지의 구조를 설명한다. 바디 부분 내용 기본 구조는 위와 같다. 는 페이지에 대한 정보가 포함되어 있다. 요소는 주소 입력창 위에 있는 브라우저 상단에 표시되는 제목이다. 요소 안에 있는 내용은 메인 브라우저 창에 표시된다. 더보기
[01. HTML] 001. 웹(Web)이란 World Wide Web이란 인터넷에 연결된 사용자들이 서로의 정보를 공유할 수 있는 공간을 의미한다. 줄여서 WWW나 웹(Web)이라고 불린다. 왜 웹인가? 웹 사이트는 인터넷이 연결된 컴퓨터에서 누구나 접속할 수 있는 편리함을 가지고 있다. 다른 언어로 응용프로그램을 만들어서 배포할 경우 사용하는 PC와 호환이 맞지 않으면 실행이 되지 않을 수도 있고 프로그램을 설치해야하며 업데이트 시에도 업데이트 파일을 받아야 하는 번거로움이 있다. 하지만 웹은 누구나 인터넷을 통해 접속할 수 있으며 서버에서 업데이트를 하면 자동으로 반영이 된다. 이런 편리함 때문에 웹서비스의 인기는 높아지고 있다. 웹으로 서비스 되는 켄쇼(KENSHO)라는 금융데이터 분석 툴은 자그마치 사용료가 1년에 10억이다. 웹 사이트를.. 더보기
728x90

티스토리툴바