<목차>
1. HTML 실행과 확장팩
2. HTML 형태 구조와 명령어
블록체인 11기 첫수강에 들어 HTMI 프로그렘을 처음으로 배우게 되었다. 배운내용을 잊어버리지 않게 복습하며 블로그를 써보려고 합니다.
1.HTML 실행과 확장팩
vscode를 사용한 HTMI 코딩을 처음 사용해보았는데 기본적으로 모든 앱화면은 코딩으로 만들어진 화면이고 세부적인 내용 버튼하나까지 코딩으로 짜여진 것 을 알 수 있었습니다(F12). vscode는 사용자의 편의성을 위하여 다양한 모드를 추가하여 사용할 수 있었으며 우리는 이중에서 한글팩과 live Server. 을 설치하여 사용하였다.
live Server은 사용자의 컴퓨터를 실제 서버처럼 사용가능하게 해주는 확장팩이라고 합니다.
2. HTML 형태 구조과 명령어
컴퓨터의 명령어는 주로 엘리먼트이라고 하는 <>괄호표로 명령어를 주는데 다른 과목은 잘모르겠지만 HTML은 <HTML> 이라는 틀에 머리 <head> 와 몸체 <bady>의 구조로 이루어 져있었습니다. 오늘 배운 명령어와 기능을 큰틀에 블록 형태와 인라인 형태로 나뉘게 됩니다.
블록 형태
<div>- 블록효과를 주기 위해서 사용
블록형태란 명령어하나당 한문장(블록)을 사용하여 다음 명령어가 나와도 앞문장과 이어지지 않고 다음문단으로 넘어가게 하는 속성을 가지고 있습니다.
인라인 형태
<span>- 인라인 형태를 주기 위해서 사용
인라인 형태란 명령어를 다음단으로 넘어가지 않고 이어지게 붙어놓는 속성이 있습니다.
이 두가지 속성의 명령어를 사용하여 문장의 위치를 결정한다고 합니다.
그밖의 오늘 배운 명령어
1. <h1> ~ <h6>
h1부터 순서대로 숫자가 클수록 숫자가 작아지며 콘텐츠 내용을 강조하는 효과가 있다고 합니다.
2. <a href>
<a> 태그의 href는 링크된 페이지의 URL을 명시함으로써 클릭하여 해당링크로 이동할 수 있게 해주는 명령어입니다.
3. <UI>
unordered list의 약자로 질서정연하지 않고 순서가 없이 명렁어 앞에 불릿표시를 표기해주는 명령어 입니다.
4. <li>
list item의 약자로서 앞선 <UI>의 목록을 나타냅니다.
5. <input>
사용자의 입력을 받기위한 상호작용 컨트롤을 생성합니다. 뒤에 type= 를 추가하여 input에 여러 옵션을 추가하여 생성 할 수 있습니다.
6. <button>
상호작용이 가능한 버튼을 하나 생성합니다.
마무리하며
오늘 배운 결과물을 토대로 만든 코딩을 올리면서 마무리 하려고 합니다.
