전역속성이란? 모든 html 태그에서 공통으로 사용 가능한 속성
1. class와 id
- Id: 고유 식별자
- “ ”안에 공백이 있으면 안된다. 대신 - (hyphen) _ (underscore)사용
- class: id와 같은 식별자 이지만 중복 사용가능
<div class=“1”>안녕</div>
<div class=“1 2”>안녕</div>
<div class=“2”>안녕</div>
- 이렇게 class에 1이 들어간 것들, 2가 들어간 것들을 묶어서 스타일을 줄 수 도 있다. class들은 space로 구분. ("1 ␠ 2")
2. Title
<div title=“첫번째 요소”>안녕</div>- "안녕" text에 마우스를 올리면 “첫번째 요소” 말풍선이 뜬다.
- "첫␠␠␠␠␠␠␠␠␠번째 요소" 라고 넣으면 그대로 나온다. 스페이싱 적용됨.
- 부모에 title이 있더라도 자식요소의 title이 덮어 씌우고 있다면 가장 아래의 요소는 바로 위 자식요소의 title이 적용된다.
3. Lang
- 전체 문서가 어떤 언어로 이루어져 있는지 알림
- 영어:
<html lang=“en”> - 한국어:
<html lang=“ko”>
- 영어:
- 혹은 일부 다른 태그에도 넣을 수 있다
<p lang=“ko”>
- 웹 접근성을 높이기 위한 수단이다. ex) 스크린 리더기 사용자
<html>에 넣어주는게 좋다. 어떤 언어로 쓰는지 더 빨리 캐치할 수 있음.
4. Data
- 사용자에게 표시는 안되지만 나중에 자바스크립트를 사용해서 해석해야할 때.
- data- 로 시작하는 속성.
5. Draggable
- 이미지를 임시적으로 드래그 할 수 있도록 한다.
- boolean 요소 이지만 draggable = “true” / “false” 적어줘야함.
6. Hidden
- 요소가 시각적으로 숨겨진다.
- 개발자 도구를 쓰면 어떤 요소가 숨겨졌는지 알 수 있기 때문에 보안상의 문제가 생길 요소는 hidden을 쓰면 안된다.
- css의 display 속성 값을 변경하면 hidden으로 인한 동작을 재정의 할 수 있다.
