⁂ HTML

[HTML] #2-3 HTML 파헤치기 3 : 폼 만들어보기

1. 입력 양식? 웹사이트에 무언가를 입력하는 공간을 만드는 것을 배워보려 한다. 이러한 공간들에는 무엇이 있을까. 로그인을 할 때 아이디와 비밀번호를 치는 공간일 수도 있고, 검색창의 빈 공간일 수도 있을 것이다. 이렇게 사용자들이 무언가의 값을 입력할 수록 해주는 것을 form이라고 부른다. 이 입력양식(하단부터는 폼이라고 부르려 한다)을 구성하는 것들은 아래와 같다. - 요소(element) : 동그란 라디오 > 네모난 체크박스 이처럼 인풋 명령어의 유형은 굉장히 많기 때문에 다 외운다기보단 필요할 때마다 W3Schools에서 찾아보는 것을 추천한다. https://www.w3schools.com/html/html_form_input_types.asp HTML Input Types W3Schools..

[HTML] #2-2 HTML 파헤치기 2 : Frame, Table

1. iframe을 사용해서 프레임 넣어보기 iframe 명령어를 사용해 문서 내 프레임을 만들고 그 내용을 채워보자. 웹사이트에서 이러한 프레임이 자주 사용되는 곳은 회원가입시 약관동의서가 적혀져 있는 창이다. 한 창 안에 많은 내용들을 다 넣기 힘들 때 새로운 프레임을 짜서 그 안에 넣는 것이다. 위의 사진은 아래와 같은 코드를 사용해 만든 결과물이다. 약관동의 2. 페이지와 페이지를 연동하기(link) 세상엔 무수히 많은 페이지가 존재한다. 그리고 그 페이지들을 모두 연결하는 것이 아니라 사용자가 원하는 페이지들을 연결해서 정리해주는 것이 필요할 것이다. 이 웹페이지의 연결은 크게 1) 서로 다른 페이지를 연결하거나 2) 같은 페이지 내에서 문서를 연결(북마크)하는 방식으로 사용된다. 1) 서로 다..

[HTML] #2-1 HTML 파헤치기 1 : 기본 문법, 문자(색상, 크기, 특수문자), 외부자료연결하기

1. 선물은 잘 포장해야지! 누군가에게 선물을 줄 때 선물만 달랑 주는 것보단 목적에 맞게 선물을 포장하고 담아서 주면 감동이 두배가 되는 법이다. 또한 전달하는 나의 마음을 포장에 더 담아낼 수도 있는 것이다. 그리고 앞선 1-1에서 말했듯 HTML은 Frontend단, 그러니까 포장을 하는 개념이라 생각하면 된다. 이 Frontend단에 해당되는 문법은 주로 Web Browser를 통해 출력이 되는 것을 목적으로 한다. 웹 브라우저의 종류는 많지만 우리는 우선 크롬 브라우저에 출력하는 것을 목표로 하려 한다. 이 웹 브라우저에 출력을 하기 위해 기본적인 문법이 필요한데 이 문법이 HTML, CSS이다. 이 두 문법을 활용하여 크롬 브라우저에 원하는 화면을 출력하는 것을 이 배움의 첫번째 목적으로 한다..

[HTML] #1-1 HTML이 뭐야?

1. 프로그램의 흐름을 이해하자 : 입력 > 가공 > 출력 우리가 개발자가 되어서 프로그램을 개발한다는 것은 결국 컴퓨터에게 일을 시키는 것이다. 그리고 컴퓨터에게 일을 시키기 위해선 컴퓨터가 알아들을 수 있는 언어로 명령을 해야 하는 법이다(이것을 컴파일이라 부른다). 어떠한 필요로 인하여 특정한 데이터를 출력하는 것에 성공했다고 생각해보자. 하지만 출력된 데이터를 나만 보는 것이 주 목적이 아니라 여러 사람과 공유를 하기 위해선 각기 다른 사람들이 사용하는 매체와 프로그램에 맞는 방식으로 제공을 해주어야 하고(입력) 그 데이터들은 각 프로그램에 맞춰 변환이 되어(가공) 사람들에게 보여지게 된다(출력). 이것이 프로그램에서 이루지는 입력, 가공, 출력의 단계이다. 좀 더 자세히 알아보자. 1) 입력 데..