[html]_11(global)

전역속성

모든 HTML 요소에서 공통적으로 사용 가능한 속성

class

공백으로 구분된 요소의 별칭
같은 값의 class를 여러개 만들 수 있다.
css적용시 .class로 찾는다.
js적용시 .class로 찾는다.

id

요소의 이름을 별칭한다.
css적용시 #id으로 찾는다.
js적용시 id값으로 찾는다.

style

요소에 적용할 css선언(인라인작성방식)

<h1 style="color: red;">안녕하세요</h1>

title

요소의 정보를 보여준다.

마우스를 갖다대보세요

lang

요소의 언어를 지정한다.

이 단락은 한국어를 사용합니다.

html 최상위에서 선언하는 이유는 사이트에서는
하나의 언어를 사용하는 경우가 대부분이다.

data-*

사용자가 정의하는 데이터 속성을 지정한다.
JavaScript에서 이용할수 있는 데이터를 저장하는 목적으로 사용한다.
data-xxx형태를 띈다.

<div id="me" data-my-name="duckey" data-my-birth="1107">Duckhwan</div>

const me =documnet.getElementById('me');  id'me'를 찾겠다. 
console.log(me.dataset.myName); me라는 id를 갖는 dataset중에서 
                                myname을 콘솔에 적겠다.
console.log($me.dataset.myBirth);

draggable

요소가 drag and drop api를 사용 가능한지 여부를 지정
초기값은 auto이다.

<div draggable="true">The element to drag.</div>

The element to drag.

hidden

요소를 숨긴다.

<form id="hidden-form" action="/form-action" hidden>
  <!-- 숨겨진 양식들.. -->
</form>
<button form="hidden-form" type="submit">전송</button>

tabindex

tab키를 이용해 요소를 순차적으로 포커스 탐색할 순서를 지정한다.
tabindex가 입력된 순서로 진행되다 그다음부터 작성된 순서되로 지정된다.
tabindex=0 을 지정하여 비대화형 콘텐츠를 대화형 콘덴츠로 바꿔줄 수 있다.
tabindex=-1을 지정하여 대화형 콘텐츠를 비대화형으로 바꿀 수 있다.

상대경로, 절대경로

상대경로
HTML,CSS파일이 작성된 주변에서 찾는다.

./ 주변에서 찾아라(생략가능하다)

../ 주변에서 상위폴더로 한번간후 찾아라

절대경로
/ -> 도메인 주소가 생략되어있다.

주석

ctrl+ / 눌러주면 브라우저가 해석하지 않는 범위를 지정할 수 있다.

특수기호

 띄어쓰기 1번
<<꺽쇄가로 열기
>>꺽쇄가로 닫기