한다 공부
[Web] HTLM & Internet 본문
웹은 Public Domain으로 저작권이 없다.
HTML (HyperText Markup Language)은 웹 페이지를 만드는데 필요한 마크업 언어이다.
Tag
<strong> 내가 원하는 내용 </strong>
= "내가 원하는 내용"이 굵게 표시된다
<u> 내용 </u>
= u는 underline의 약자로 "내용"에 밑줄이 그어진다
<h1> 내용 </h1>
= h1부터 h6까지 존재하는 이 태그는, 제목을 나타내는 태그이다. headings의 약자이고 숫자가 올라갈 수록 글씨가 작아진다. 이 태그에 감싸진 내용은 자동 줄바꿈이 된다.
<br>
= 줄 바꿈 태그, 상당히 자주 쓴다. 닫는 태그가 없다.
<p> 내용 </p>
= 단락을 변경하는 태그. br 태그와 보여지는 것에 큰 차이는 없다. 단락이 정해진 여백만큼 구별되는데 css를 이용하면 조절할 수 있다. <p style="margin-top:40px;">라는 css을 이용하면 단락이 40픽셀 단위로 구별된다.
속성
=태그의 심화된 문법
<img src="coding.jpg" width="100%">
= 이미지 삽입, src는 source의 줄임말. 이미지가 html파일과 같은 디렉토리에 있고, 이미지 이름이 coding.jpg라고 가정한다. width는 크기를 조절한다.
<parent>
<child></child>
</parent>
= 이 형태에서 다른 태그를 포함하는 태그를 부모태그, 포함된 태그를 자식태그라고 한다.
<li> 내용1 </li>
<li> 내용2 </li>
= list 로 나타낼 수 있는 태그
- 내용1
- 내용2
처럼 나타낼 수 있다. li로 묶을 경우 어디서부터 어디까지 li가 속하는지 그룹핑을 하기 위해 ul 태그를 이용한다.
<ul>
<li> 내용1 </li>
<li> 내용2 </li>
</ul>
위와 같이 ul을 이용해서 그룹핑할 수 있다.
<ol>
<li> 내용1 </li>
<li> 내용2 </li>
</ol>
= ul은 unordered list, ol은 ordered list의 약자로 ol로 묶게 된다면 넘버링이 된다.
1. 내용1
2. 내용2
위와 같은 형태인 숫자 리스트로 나타난다.
<table>
<tr>
<td> 내용 <td>
<td> 설명 <td>
</tr>
<tr>
<td> 내용2 <td>
<td> 설명2 <td>
</tr>
</table>
= table 태그는 3대가 같이 다닌다. 이를 이용하면
| 내용 | 설명 |
| 내용2 | 설명2 |
위와 같은 table, 표가 생성된다.
중요한 것
<title> 제목 </title>
= title 태그를 이용해서 파일 제목을 설정할 수 있다.
<meta charset="utf-8">
= 한글은 파일의 저장방식에 따라 오류가 생길 수도 있다. UTF-8 파일 형식일 경우 오류가 생기지 않으니 열 때 UTF-8 형식으로 열도록 알려줘야한다.
위와 같은 제목과 파일형식은 <head> - </head> 태그에 묶어주어야 한다.
ul, ol, h1, br등 본문을 나타내는 태그들은 <body> - <body> 태그로 묶어주어야 한다.
head태그는 body태그를 감싼다. head 태그 또한 <html> - </html> 태그에 감싸진다.
<html> 태그 위에는 관용적으로 <!doctype html>을 작성해준다. 이 문서가 html임을 나타낸다.
.
.
.
<a href="https://sxyzn.tistory.com" target="_blank" title="클릭 전 정보"> 블로그 </a>
= a는 anchor의 약자이다. "블로그" 를 누르면 https://sxyzn.tistory.com 라는 주소로 이동한다. target="_blank"를 사용했기 때문에 새 탭에서 열린다. 뒤에 쓰인 title=... 을 이용하면 클릭하기 전에 "클릭 전 정보" 라는 간단한 설명을 띄워준다.
서버와 클라이언트
클라이언트 : 서비스를 이용하는 사람, 혹은 컴퓨터 (웹 브라우저를 이용하여)
서버 : 서비스를 제공하는 사람, 혹은 컴퓨터
웹 서버를 이용하면 내 컴퓨터에 있는 문서를 전 세계에서 웹 브라우저를 통해 볼 수 있다.
이 일을 하기 위해 두 가지 방법을 사용할 수 있다.
1. 직접 웹 서버 설치하기
2. 대행해주는 업체 이용하기 (=웹 호스팅)
웹 호스팅
인터넷이 연결된 컴퓨터를 호스트라고 한다.
웹 서버를 운영하기 위한 컴퓨터, 즉 호스트를 빌려주는 업체를 web hosting 업체라고 한다.
대표적이면서 현재 무료로 운영 중인 서비스는 github이다.
우리가 제작한 html 파일을 업로드하면 깃허브를 통해 사람들이 볼 수 있다. 또한 웹 서버를 활성화 하면 주소가 생성되며 사람들에게 공유할 수 있다. 사람들은 해당 주소를 인터넷 브라우저에 입력하여 나의 문서를 볼 수 있다.
[참고자료] 생활코딩 WEB1 - HTML & Internet
'Dev > Web' 카테고리의 다른 글
| [Web] Cookie, Session (1) | 2023.05.13 |
|---|---|
| [Web] MySQL (0) | 2021.11.22 |
| [Web] JavaScript (0) | 2021.11.09 |
| [Web] Git (0) | 2021.11.02 |
| [Web] CSS (0) | 2021.10.12 |