HTML_Tag & Attributes
HTML_태그
html의 필수 태그
- html을 시작 할 때 기본적으로 아래의 태그들이 적용되어야한다.
<!DOCTYPE>
<html>
<head>
</head>
<body>
</body>
</html>-<head> 태그 내에는에는 아래의 태그들이 적용되어야한다.
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>repl.it</title>
</head>-<meta charset="utf-8"> : 한글, 일본어, 중국어가 포함된 페이지라면 utf-8 이라는 값으로 문자 인코딩을 추가해줘야 한다.
-<meta name="viewport" content="width=device-width">: 디바이스의 가로 크기가 곧 웹 페이지의 가로와 같다는 의미이다. 모바일에서 웹사이트가 예쁘게 잘 보이려면 추가해야 하는 정보이다.
-<title>내용</title>: 브라우저 탭에 보이는 페이지 이름이다.
<p>와 <span>의 차이점
| 태그 | |
|---|---|
<span> | 한줄에 이어서나오는 요소이며 inline element 이다 |
<p> | <span>과 달리 줄바꿈일어나며 block-level elements 이다 |
HTML_속성
<a href="https://wecode.com">위코드로 이동</a>a: tag 이름href: attribute(속성) 이름이며- https://wecode.com : href 속성에 대한 attribute 값
- "위코드로 이동" : content(내용)입니다.
id, class
- id와 class 모두 각 태그에 이름을 주는 속성
id: 여러 태그에 중복 불가하며 대상을 식별할 수 있는 고유한 값이어야 한다.class: 여러 태그에 중복된 이름을 부여할 수 있다.
여러 속성 추가
<div id="profile" class="content-wrap"></div>
<img src="./hi.png" alt="내사진" >- 하나의 태그에 2개 이상의 속성을 부여할 수 있다. 여러 속성을 주고 싶으면 한 칸 띄어쓰기 후 추가하면 되며, 속성의 순서는 상관 없다.
