유용한 사이트
프로그래밍 언어 태그 설명 https://devdocs.io/
WaybackMachine 예를들어 naver 치면 예전 화면 볼수 있음. 날짜 시간별로 https://archive.org/web/
유니코드 이모티콘 복사해서 사용가능 https://home.unicode.org/emoji/emoji-frequency/
이미지 동그랗게 잘라주기 https://crop-circle.imageonline.co/#circlecropresult
키보드에서 이모티곤 찾는 법: 맥에서는 control+command+space
윈도우에서 방법1 이모티콘 넣을 자리에 커서 놓고 WIN+.(마침표) 또는 WIN+;(세미콜론)
윈도우에서 방법2 테스크바 오른쪽 클릭-터치 키보드 버튼 켜기- 키보드에 보면 이모티콘 나옴
boiler plate
! tab 누리면 기본 뼈태를 만들어 준다. 이 기본 뼈대를 보일러 플레이트라고 한다.
<DOCTYPE html> : document type은 html 5이다. html4의 보일러 플레이트는 좀 더 내용이 많다.
<meta charset="utf-8">: meta tag는 이 웹페이지가 뭘 보여줄지 말하는 것.
meta tag 중에서 characterset="UTF-8" name="keywords" content="HTML,CSS,XML,JavaScript"
unicode는 utf-8와 비슷
charset = characterset
Opening Tag / Closing tag / Content
<h1> Hello World </h1>
opening tag: <h1>
closing tag: </h1>
content: 이 사이에 들어가는 내용
<p> </p> paragraph
Self-closing Tag
<br> : self-closing tag, line break
<hr> : self-closing tag, horizontal rule
<!-- 기타 설명 --> : comment tag
Element, Attribute
<hr> : self-closing tag, horizontal rule
<hr size="3">
hr : HTML element
size="3": HTML Attribute
List
ul : unorder list
li: list
ol: order list
<ol style="A">
A
B
C
순으로 정렬됨
Image 넣기
<img src="cat.jpg" alt="cat" width="128" height="128">
src="../img.cat.jpg" : 이미지 위치
앞..은 지금 파일에서 앞 파일로 이동하라는 의미
링크 걸기
하이퍼링크: 글자나 사진 누리면 다른 페이지로 이동 시켜줌.
하이퍼 텍스트: 하이퍼 링크가 되는 텍스트
<a> link text </a> : anchor tag
<a href=""> </a>
href: 이동할 페이지 주소
현페이지에서 링크된 페이지로 이동
<a href="https://www.facebook.com/aaa">Jimin's Facebook</a>
링크에 글자 진하게 하기
<strong><a href="https://www.facebook.com/aaa">Jimin's Facebook</a></strong>
새창에서 링크된 페이지 뜸
<a href="https://www.facebook.com/aaa" target="_blank">Jimin's Facebook</a>
내가 만든 페이지로 이동하기
hobbies.html파일을 index.html과 같은 라인선상에서 만들고 링크 걸어주기
'HTML' 카테고리의 다른 글
[HTML] dl, dt, dd | 사전 (0) | 2022.03.14 |
---|---|
html] div 태그 (0) | 2021.07.19 |
Form 태그 / input 버튼 (0) | 2021.06.20 |
table 태그 (0) | 2021.06.20 |
댓글