HTML_Tag & Attributes

ha ju·2021년 4월 12일
0

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개 이상의 속성을 부여할 수 있다. 여러 속성을 주고 싶으면 한 칸 띄어쓰기 후 추가하면 되며, 속성의 순서는 상관 없다.

0개의 댓글