html5 웹페이지 예제

일부 줄의 시작 부분에 태그를 “이동”하기 위해 공백을 추가했습니다. 필수는 아니며 페이지 표시 방식에는 영향을 미치지 않지만 소스 코드를 더 읽기 쉽게 만듭니다. 이를 들여쓰기라고 합니다. 편집기에서 탭 키를 누르면 동일한 결과를 얻을 수 있습니다. 텍스트 편집기(메모장++, jEdit, vim 등)는 extension.html(예: test.html)을 사용하여 파일을 만드는 데 사용됩니다. 이것은 우리의 웹 페이지가 될 것입니다. 웹 사이트 또는 웹 앱 개발을 다음 단계로 끌어올리는 또 다른 방법은 오늘날 널리 사용중인 최신 프레임워크 중 하나를 시도하는 것입니다. 예를 들어 반응 및 각도에 대한 SitePoint의 광범위한 리소스를 확인하십시오. 이 예제의 마지막 태그는 태그입니다. 열기 및 닫는 본문 태그는 모든 콘텐츠가 추가되는 위치입니다. 이미지, 텍스트, 비디오 및 오디오는 모두 본문 태그 내에 추가됩니다.

이 예제에서는 “사용자에게 표시할 콘텐츠”라는 텍스트가 브라우저에서 렌더링됩니다. 이후 장에서는 이 텍스트를 양식에 일치시키고 웹 페이지에 다른 속성을 추가하는 방법을 배웁니다. 코드의 기본 태그입니다. 여기에는 페이지의 전체 콘텐츠가 포함됩니다. 보시다시피 닫는 태그는 코드 끝에 바로 있습니다! 코드의 첫 번째 줄은 DOCTYPE입니다. 기술적으로 이 태그를 제외할 수 있으며 브라우저는 페이지 내의 HTML 버전을 해독하려고 시도합니다. 그러나 구문 분석자에 의존하지 않고 명시적으로 지정하는 것이 가장 좋습니다. 이 DOCTYPE은 HTML5에 만전을 기합니다. 이전 버전의 HTML에는 다른 DOCTYPE 태그가 있으므로 HTML5를 사용하는 경우에만 이 DOCTYPE을 사용할 수 있습니다. 당신은 브라우저에서 어떻게 생겼는지에 대한 아이디어를 가지고 있어야합니다 – 문서의 제목, “첫 번째 HTML5 문서”와 텍스트 “좋아, 이제 우리는 어딘가에 갈거야!” 페이지의 왼쪽 상단에 기록.

물론 그렇습니다! 그것은 당신과 페이지의 소스 코드를 읽는 사람들에 의해 사용 됩니다. 댓글을 사용하여 페이지 작동 방식에 대한 표시를 남길 수 있습니다. 첫 번째 줄은 doctype이라고 합니다. 그것은 효과적으로 HTML 웹 페이지임을 나타내는 것이 필수적이다. 다른 태그와 같은 태그가 아니며(느낌표로 시작함) 규칙을 증명하는 예외로 간주될 수 있습니다. 이제 페이지를 저장한 폴더에서 파일 탐색기를 엽니다. 방금 만든 파일(다음 그림)이 표시됩니다. 이 문서 형식 줄은 한때 엄청나게 복잡했습니다.

그것은 당신의 머리에 그것을 유지하는 것은 불가능했다. XHTML 1.0에서는 작성해야 했습니다:. 웹 마더의 기쁨에, 그것은 HTML5에서 그것을 단순화 하기로 결정 했다. 짧은 문서 유형 태그()가 표시되면 페이지가 HTML5로 작성됨을 의미합니다. 방금 첫 번째 HTML5 웹 페이지를 만든 것을 축하드립니다!

요소가 요소 내부에 어떻게 있는지 알아 차셨습니까? 이를 중첩 요소라고 하며 HTML 구조의 매우 필수적인 부분입니다. 지금은 이것을 그대로 두겠지만, 요소를 중첩하는 아이디어를 소개하고 싶었습니다. 텍스트에 대한 다른 일반적인 태그는 , 및 태그입니다. (굵게) 태그 대신 태그를 사용할 수도 있습니다. 태그와 태그는 중요한 텍스트의 서식이 굵게 표시되어야 함을 나타냅니다. 태그는 텍스트를 기울임꼴로 지정합니다.