반응형
html 공부를 시작했다.
웹 크롤링 할 때 살짝 맛만 본거여서 이번기회에 잘 공부해보려고 한다.
...
파일 확장자를 .html로 저장하고 더블클릭하면, 크롬이나 엣지에서 html이 실행된다.
...
<!DOCTYPE html>
<html>
<body>
- 여기다가 글을 입력해도 오류가 안나!
<br> 얘는 줄바꿈이다.
<h1>1. 헤더 header, h</h1>
<h1>- html 헤더을 입력한다 .</h1>
<h1>- 헤더은 h1부터 h6 태그로 정의된다.</h1>
<h1>- 여러 개 입력할 수 있다.</h1>
<h1>hl 헤더 입력</h1>
<h2>h2 헤더 입력</h2>
<h3>h3 헤더 입력</h3>
<h4>h4 헤더 입력</h4>
<h5>h5 헤더 입력</h5>
<h6>h6 헤더 입력</h6>
<br>
<h1>2. 단락 paragraph, p</h1>
<p>- html 단락을 입력한다.</p>
<p>- 단락은 p 태그로 정의된다.</p>
<p>- 단락도 여러 개 입력할 수 있다.</p>
<p>p 단락 입력</p>
<p>p 단락 입력</p>
<br>
<h1>3. 링크 a hyperlink, a href</h1>
<p>- html에 링크를 달 수 있다.</p>
<p>- 링크는 a 태그의 herf 속성에 지정된다.</p>
<a href="https://gallery-k.tistory.com">gallery-k 블로그로 이동</a>
<br><br><br>
<h1>4. 이미지 image, img</h1>
<p>- html에 이미지를 첨부할 수 있다.</p>
<p>- 이미지는 img 태그로 정의된다.</p>
<p>- src속성 : 사진경로 (실행파일과 같은 경로면 사진 이름만, 아니면 경로전체, 인터넷 경로도 가능)</p>
<p>- alt속성 : 사진에 대한 설명을 적을 수 있음. 대체택스트</p>
<p>- width, height속성 : 너비와 높이 지정</p>
<img src="C:/Users/user/VscodeProjects/BasicStudy/HtmlStudy/사진.jpg" alt="gallery-k.tistory.com" width="100" height="100">
<br><img src="사진.jpg" alt="gallery-k.tistory.com" width="100" height="100">
<br><img src="사진jpg" alt="alt = 사진 깨졌을 때 글자" width="100" height="100">
</body>
</html>아직 자세히 공부하지는 않았지만,
body의 다음 태그들이 보편적이라고 한다.
이제 여기서 바탕색을 주거나, 글자 모양을 바꿔주거나 하면서
html을 꾸며준다고 한다.
...
반응형
'컴퓨터 > Front' 카테고리의 다른 글
| [html] html 기본 문법 익히기_6. html 에 데이터 테이블 (표) 셀 병합 (0) | 2021.10.14 |
|---|---|
| [html] html 기본 문법 익히기_5. html 에 데이터 테이블 (표) 추가, 크기조절 (0) | 2021.10.13 |
| [html] html 기본 문법 익히기_4. html body p 태그와 속성 (0) | 2021.10.12 |
| [html] html 기본 문법 익히기_3. html body a 태그와 속성 (0) | 2021.10.11 |
| [html] html 기본 문법 익히기_2. html body img 태그와 속성 (0) | 2021.10.10 |
댓글