프로그래밍/HTML&CSS
HTML5 문서 구조
하와이블루
2022. 8. 20. 12:29
728x90
<!DOCTYPE html> <!--문서를 html이라고 선언하며, 버전 5를 나타냄-->
<html lang="en">
<!--lang 속성 : 웹 접근성에 관한 명시. 스크린 리더에서 언어를 인식하여 자동으로 음성을 변환하거나,
해당 언어에 적합한 발음을 제공할 수 있음 (한국어 : ko)-->
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- <meta> : <head> 태그에 정보를 추가하기 위한 태그 -->
<!-- charset 속성 : 문자를 인코딩할 때 문자코드를 설정하는 역할, 우리나라 윈도우 기본 문자셋인 EUC-KR을
사용해도 되지만 다국어로 인코딩할기 위해서는 UTF-8 문자셋을 사용하기 권장 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--모바일로 최적화된 사이트에 포함하는 META 속성-->
<!--device-width : 디바이스에 맞는 크기로 viewport를 잡는 것.-->
<title>Document</title>
</head>
<body>
<img src=apple.png></img>
<!-- --- --- ---------------- -->
<!-- 요소 속성 값 -->
</body>
</html>
속성은 해당 요소(태그)에 대한 추가적인 정보를 제공하는 역할을 한다.
<img src=apple.png></img> (O)
<img src=맛있는 사과.png> (X) // 띄어쓰기 까지만 속성을 읽음
<img src="맛있는 사과.png"> (O) // 띄어쓰기가 존재할 경우 ""을 이용함
<!--속성에 대한 값은 따옴표를 꼭 사용하지 않아도 되지만,
값에 띄어쓰기가 있을 경우 문제가 발생할 수 있어서 따옴표 쓰기를 권장함 (쌍따옴표, 따옴표 둘다 가능)-->728x90