HTML, CSS/HTML (14) 썸네일형 리스트형 [HTML] 기본 템플릿(!) HTML 코드를 만드는 데 vscode를 사용할 것이다. 이 때, 간단한 입력으로 기본 템플릿을 불러올 수 있다. 처음 시작 위치에서 !을 누르면 다음과 같이 나오는 데 엔터를 누르면 된다. 그럼 다음과 같은 이나 등을 쓰지 않고 한 번에 받을 수 있다. [HTML] 이미지 삽입 이미지를 넣을 수 있도록 하는 태그는 단일 태그로 src 다음 쌍 따옴표 안에 이미지 주소를 넣으면 이미지를 띄울 수 있다. 이미지 주소는 이미지 위에서 우클릭을 누르고 이미지 주소 복사를 누르면 얻을 수 있다. 이미지 주소말고 컴퓨터에 있는 사진이나 그림을 사용하고 싶다면 지금 사용하고 있는 html 파일에서의 이미지 파일의 상대 경로를 적거나 절대경로를 적으면 된다. 위 코드의 경우 위키 백과의 이미지를 동일 파일에 넣었기 때문에 이미지명만 적었다. [HTML] 제목 , 본문, 하이퍼 링크 1 2 3 4 5 6 aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa 내블로그 은 제목을 나타내는 태그로 h1~h6까지 있다. 숫자가 작을 수록 중요한 제목이고 아무런 스타일을 입히지 않으면 h1에서 h6순으로 크기가 작아진다. 는 문단을 나누는 태그로 사용하면 문단과 문단을 나눠줄 수 있다. 은 문장의 줄을 나누는 태그로 태그처럼 혼자서 쓰인다. html은 위 코드같은 줄바꿈 엔터마저 공백으로 인식하기 때문에 다음 줄로 나눠야하는 경우 을 통해 나눈다. 은 글자에 하이퍼링크를 추가할 수 있는 태그이다. 주소에 html 파일을 입력하면 html 파일로 넘어가게 만들 수 있다. 은 각각 로 html에서 태그를 사용하며 많이 쓰.. [HTML] 한글을 안 깨지게 하기 크롬에서는 한글이 깨지지 않다가 다른 브라우저에서 한글이 깨지는 경우가 있다. 이는 인코딩(encoding) 방식이 브라우저마다 달라서 생기는 일이다. 이를 방지하기 위해서는 html 파일에서부터 이 파일이 어떤 인코딩 방식을 사용하는지 선언해주면 한글이 깨지는 일을 방지할 수 있다. Hello html! 인코딩은 페이지에 대한 정보이므로 태그에 들어가고 인코딩 방식을 정해주는 meta는 안에 내용을 넣지 않으므로 를 쓰지 않는 것을 볼 수 있다. utf-8은 한글을 지원하는 인코딩 방식이고 많이 사용한다. [HTML] HTML의 구조 Hello html! 가장 기초적인 HTML 구조이다. 이 파일이 html로 작성될 것을 선언하는 것으로 html 파일의 제일 첫 단에 들어간다. html의 가장 기초적인 태그로 이 안에 html의 정보들이 들어가야 한다. 페이지 안에서 보이지 않는 페이지의 정보들을 적는 공간이다. 페이지의 이름이 대표적인 예시 페이지에서 보여줄 내용이 들어가는 칸 위 코드를 따라서 html 파일을 만들면 아래와 같이 나온다. [HTML] html 파일 만들기 html 파일을 만들기 전에 문서를 만들 때 한글이나 워드를 쓰듯이 html 작성 프로그램이 필요하다. https://code.visualstudio.com/download Download Visual Studio Code - Mac, Linux, Windows Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. Download Visual Studio Code to experience a redefined code editor, optimized for building and debugging modern web and cloud applications. code.visualstudi.. 이전 1 2 다음
