HTML/HTML
-
HTML - <form> 태그HTML/HTML 2020. 3. 4. 21:54
오늘은 form 태그에 대해서 알아보자! form 태그란? → 로그인을 하거나 회원가입을 하거나 물건을 사거나 글을 작성할 때, 입력한 정보를 서비스를 제공하는 서버한테 정보를 전송할 때 사용하는 글자를 입력하는 것들 또는 무언가 선택하는 것들을 우리는 form이라 부른다. 즉, 사용자가 입력한 정보를 서버로 전송할 때 사용할 때 쓰는 태그가 form 태그이다. 그러면 form 태그로 과연 어떠한 것을 보낼까? 우선 사용자가 입력한 정보를 서버로 전송하기 위해서는 사용자로부터 정보를 입력 받을 수 있는 것을 만들어야 한다. 그때 사용하는 태그가 바로 input태그이다. input 태그에 type이라는 속성에 text라고 설정하게 되면, 사용자로부터 문자 정보를 일력 받을 수 있는 박스가 생긴다. 아이디 ..
-
HTML - <table>태그HTML/HTML 2020. 3. 2. 01:58
오늘은 태그에 대해서 알아보자! 태그란? → 표를 만드는 방법을 의미하며, HTML 태그 중에서 가장 복잡하고 이해하기 어려운 태그라고 할 수 있다. 테이블을 사용 할때, 값을 넣으려고 하면 어떤 특정한 태그로 묶어 줘야 한다. 그때 사용하는 태그가 바로 태그이다. 태그의 약자는 table data를 의미한다. 이름 성별 주소 즉, 항목 하나하나를 td라는 이름으로 묶어주며, 표에서 각각의 실제 데이터들을 의미한다는 뜻이다. 그러고 나서, 각각의 행들을 태그로 묶어 줘야 한다. 태그의 약자는 table row를 의미한다. 즉, 같은 행에 속하는 태그들을 이라는 태그로 묶어주면, 웹 브라우저는 태그 아래에 있는 태그들을 같은 행으로 표시한다. 하지만, 행과 열이 나뉘었지만 명확한 표시를 원한다. 그럴 때..
-
HTML - img태그HTML/HTML 2020. 2. 29. 23:19
오늘은 img 태그에 대해서 알아보자! 화면이 이미지를 표시할 때, 라는 태그를 쓴다. 그렇다면 img 태그는 무엇일까? → 화면이 이미지를 표시할 때, 라는 태그를 쓰며, 태그는 닫을 필요는 없다. 그리고 src라는 속성을 사용해서 img.jpg라는 파일 이름을 적는다. 그러면 웹 브라우저는 img태그를 보고 "아! 여기는 이미지가 오겠구나!"라고 인식한다. 그리고 src라는 것을 통해서 "아! 여기에는 이미지를 표시해주면 되겠구나!"라고 브라우저가 인식한다. 만약 이미지의 크기를 변경하고 싶다면, width 속성을 이용하고, 만약 높이를 지정하고 싶다면, height 속성을 이용한다. 여기서 높이만 지정하게 되었을 때, 이미지가 왜곡되는 현상이 없어진다. 그에 맞는 적절한 폭의 길이를 웹 브라우저가 ..
-
HTML - <p>태그 / <br>태그HTML/HTML 2020. 2. 26. 17:47
오늘은 ~ 태그와 태그에 대해서 알아보자! [예제] 간장 공장 공장장은 강 공장장이고, 된장 공장 공장장은 공 공장장이다. 저분은 백 법학박사이고, 이분은 박 법학박사이다. 작년에 온 솥장수는 새 솥장수이고 금년에 온 솥장수는 헌 솥장수이다. 우선, 문장이 저렇게 3개의 문장이 주어졌다. 하지만, 3개의 문장이 단락이 구분되는 것이 아니라 한 줄로 출력되는 것을 확인할 수 있다. 그렇다면 이 3개의 문장을 가지고 단락을 구분하고 싶다면 태그를 사용하면 가능하다. [예제] 간장 공장 공장장은 강 공장장이고, 된장 공장 공장장은 공 공장장이다. 저분은 백 법학박사이고, 이분은 박 법학박사이다. 작년에 온 솥장수는 새 솥장수이고 금년에 온 솥장수는 헌 솥장수이다. 결과는 이렇게 단락이 구분되어 깔끔하게 3개의..
-
HTML - <a>태그와 속성HTML/HTML 2020. 2. 24. 00:27
오늘은 속성이라는 문법과 링크라는 HTML에서 가장 중요한 두 가지 기능을 알아보겠다. 태그는 링크를 걸고자 하는 즉, ~ 사이에 내용이 링크라는 사실을 브라우저에게 알려주는 태그이다. 하지만, a 태그만 쓴다고 해서 링크가 생기지는 않는다. 네이버로 이동 만약, 네이버가 링크라고 한다면? 이 링크가 어떤 웹 페이지에 연결되어야 되는지에 대한 바로 그 웹 페이지의 URL이 어딘가에 적혀 있어야 한다. 그 정보가 없기 때문에 브라우저는 아무런 행동도 하지 않는 것이다. 그럴 때, href 이라는 속성을 이용하면 링크를 걸 수 있다. 네이버 이렇게 입력하면, 이제야 링크가 걸리는 것을 알 수 있다. 이 링크를 클릭하면, 해당 홈페이지로 접속하는 것을 확인할 수 있다. 그런데, 만약 해당 홈페이지에서 접속하지..
-
HTML - 기본문법HTML/HTML 2020. 2. 23. 23:35
오늘은 가장 기본적인 문법 태그를 알아보겠다. 여기서 태그란? 꺾세 괄호 사이에 들어가는 값들을 태그라 하고, (시작 태그) ~ (닫히는 태그)로 표시한다. 이 태그가 HTML 문법에서 가장 중요하며, 꼭 공부해야 한다. 몇 가지 기본 태그들을 알아보겠다. 만약, 글자를 강조하고 싶다면? ~ 뒤에 따라오는 글자를 "진하게 표시하라."라는 '강조한다' 의미를 가지고 있다. 안녕하세요.저는 개발자 입니다. 만약 제목을 작성하고 싶다면? ~ heading1의 약자이며, heading은 제목을 의미하기 때문에 '제목 1'이라는 뜻이다. 즉, ~ 사이에 글자들을 제목으로 인식한다. 오늘의 제목 만약 작은 제목을 작성하고 싶다면? ~ 로 작성하면 소제목이 된다. 오늘의 제목 오늘의 소제목
-
HTML - 기본 개념HTML/HTML 2020. 2. 23. 23:01
HTML이란? Hyper Text Markup Language의 약자이다. "Hyper Text"라고 하는 것은 어떤 기능이 존재한다. 그 기능이 어떤 것 일까? 여러분이 웹 브라우저를 통해서 어떤 웹페이지를 보면 그 웹페이지에 언제나 있는 것들이 있다. 그것은 바로 '링크' 이다. 바로, 링크라고 하는 기능이 바로 "Hyper Text"이다. 그리고, Markup(마크업)이라고 하는 것은 그다음에 나오는 Language와 관련이 깊다. 이 HTML이라는 것은 컴퓨터 프로그래밍 언어라는 것인데, 바로 이 Markup이라고 하는 문법적인 형식, 또는 문법적인 특성을 가지고 있는 컴퓨터 프로그래밍 언어라는 뜻이다. 즉, Hyper Text를 가장 중요한 특징으로 하는 Markup(마크업)라고 하는 이 형식을..