마크업 언어

배움/HTML&CSS

Macy 2023. 1. 3. 21:05

마크업이란

컴퓨터 언어를 사용 할 때 쓰는 구조이다.

대표적인 마크업 언어로는 HTML(Hyper Text Markup Language)가 있다.

HTML은 문서의 글자 크기, 글자모양, 색, 문서 이동 등을 정의하는 텍스트이다.

HTML을 작성할 때

<html lang=en>은 영문으로 작성된 언어이고

<html lang=ko>은 국문으로 작성된 언어이다.

HTML 문서가 끝났을 때는 </html>이라고 작성한다.

html태그 사이에 올 수 있는 태그는 다양한데 대표적으로 head 태그와 body 태그가 있다.

내용을 작성하는 태그는 여러 가지가 있는데 heading 태그로 <h1></h1>태그는 <h6></h6>까지 있다.

h1이 가장 큰 폰트를 가지며 h6태그가 가장 작은 폰트를 가진 heading 태그이다.

p태그는 pharagraph의 약자이다.

div태그는 무속성 태그로 문단을 나눈다.

p태그와의 차이점이라면 태그 앞 뒤로 여백이 생기지 않는다는 것이다.

span태그는 줄 바꿈 없이 영역을 묶는 태그이다.

버튼을 만들고 싶다면 button태그를 이용하면 되는데

<button>텍스트</button>이라고 작성하면 된다.

선택창을 만들기 위해서는 select태그를 이용하면 되는데

</select>

이라고 입력하면 된다.

선택 박스를 만들기 위해서는 input태그를 이용하면 되는데

<input type=checkbox> 이라고 작성하면 된다.

라디오 박스를 만들기 위해서는 input태그를 활용하여

<input type=radio>라고 작성하면 된다.

슬라이더 콘트롤을 만들 때는

<input type=range>라고 작성하면 된다.

svg를 활용하는 방법

svg : Scable Vector Graphics

2차원 백터 그래픽을 사용하는 형식이다.

svg의 범위를 먼저 정해 준 뒤 상세한 스펙을 작성해준다.

라고 작성해주면 x축에서 0에서200까지의 선, y축에서 1에서200까지의 선이 rgb색상(250,0,0)이며 선두께는 2px로 나타나게 된다.

rect태그는 rectangle의 약자로 네모 모양을 의미한다.

를 작성하면 파란색으로 칠해진 네모 모양이 나타나게 된다.