> HTML 단축기

F5 새로고침
ctrl + s 저장
ctrl + o 파일찾기
ctrl + 스페이스바 = 단축된 단어
ctrl + / 주석처리
alt + shift + f 줄정렬 (비쥬얼스튜디오코드)
ctrl + shift + s 다른이름으로 저장
window + 방향키 창2개로 나누기
tap 띄어쓰기, 코드 자동완성
ctrl + z 뒤로가기
ctrl + shift + z 다시 앞으로 오기
메모장 > 다른이름으로 저장 > 파일형식 > 텍스트문서 > 제목+ .html = 메모장에서 인터넷으로 생성됨
뷰-레이아웃-컬럼2 : 2분할 만들어줌
ctrl+art+화살표 : 여러줄 동시입력하기
ctrl+마우스 : 여러줄 동시 입력하기
ctrl+shift+C : 컬러피커 (색상고르기)
Ctrl + f or crtl+shift+f 검색기능
p : 고정
더블클릭 후 이동하면 옮기는 기능
ctrl + alt = 동시작성
ctrl + 엔터 = 마우스는 그대로
fll float:left;
flr float:right;
w100+h100 width100; height:100px;

태그

<br> 줄바꿈 (단일태그) 

<h1>~ <h6> 대제목 

<li> (list) 순서

<ol>,<ul> 과 <li> 는 서로 부모자식관계라 붙어있다.

<ul>은 순서가 나타나지 않고 <ol>은 순서(번호)가 나타난다.

<ol type="a"> 이런식으로 설정하면 번호 대신 a,b,c ... 로 나온다. 

<p>(paragraph) 단락 표시</p> 하나의 단락과 시작과 끝을 표시한다

<i>(italic체) 기울어진다</i>
<em>기울어지면서 강조되는 시멘틱태그</em>   시멘틱태그: 의미가 있는 태그

<b> (bold) 두꺼워진다 </b>
<strong> 두꺼워지면서 강조하는 시멘틱태그 </strong>

<ins>밑줄이 쳐진다</ins> & <del>취소선이 쳐진다</del>

<mark>디폴트값이 노란배경</mark> 디폴드값이 노란배경

윗첨자<sup> 제곱</sup>¹과 아래첨자를 <sub>표현 </sub>₁

`<pre></pre>` 태그 안에선 많은 공백이나 줄바꿈을 인식

<iframe> 태그는 다른 사이트를 가져오는 태그

<dt> 홈페이지 밑에 있는 건물회사같은거 쓸 때 사용
<dd> 건물회사 소개 쓸 때 사용
<div> 의미없이 묶어놓는 태그


속성‘id’
원하는 위치에 id=’‘속성을 추가해준다
➝링크에 #id명 넣어주면 해당 문서의 아이디값으로 이동한다.
<a href = “#ame“>아메리카노</a> ➝ <h1 id=”ame”>아메리카노</h1>

링크 (a = anchor 연결하다)

<a href=“http://링크”>단어</a> 링크페이지로 이동
<a href=“http://링크” target=“_blank”>단어</a> 추가페이지로 링크페이지 생성
(링크“ target 사이에 공백 필수)
<a href="./이미지.png"download>단어</a> 누르면 이미지 다운로드
<a href="#move">단어</a> 누르고 태그에 id값을 주면 그쪽 글로 이동된다.

<img src="이미지 링크"> 이미지를 눌렀을 때 이동하고 싶으면 
<a><img src="이미지 링크"></a>
<img src="이미지 링크" alt="문구> 시각장애인분들에게 alt에 있는 문구를 읽어준다

<meta charset="UTF-8">다국어언어허용
<meta name="viewport" content="width=device-width, 반응형 홈페이지 만들 때 꼭 필요한 태그
initial-scale=1.0"> 화면 1.0배로(표준)