HTML
-
HTML이란?이거 공부 했더니 어때?/HTML & CSS & JS 2020. 10. 14. 05:30
저번시간에 배웠듯이, HTML은 Hyper text markup launguage의 줄임말입니다. 즉, 웹사이트에서 각 요소가 무엇을 뜻하는지 알려주는 언어가 바로, HTML입니다.우리는 HTML을 tag, 태그로 이용해서 작성할 것입니다. HTML 문서는 대부분 엄청나게 많은 태그로 이루어져 있습니다. 근데 이 태그를 사용해서 HTML 문서를 작성할 때 따라할 규칙들이 있습니다.정리하자면, HTML은 태그가 엄청 많은 텍스트 문서이고, 웹사이트의 요소들을 밑줄 그어서 설명해 주는 언어입니다. 즉, 웹사이트의 내용이 무엇인지, 그 요소들을 구분해주는 언어가 바로 HTML입니다.
-
공부계획 #2 HTML이거 공부 했더니 어때?/HTML & CSS & JS 2020. 10. 13. 04:40
이번에는 HTML에 대해서 배우도록 하겠습니다.1> 제일 먼저, HTML이론에 대해 간단하게 배우고, HTML 문서를 작성해 보도록 하겠습니다.2> 그리고 HTML 문서를 작성할 때 알아두면 유용한 중요한 태그들도 함께 배워보겠습니다.3> 그런 다음, 모든 개념과 이론들을 실전에서 실전에 적용해 보도록 하겠습니다. 즉, 처음에는 개념을 배우고, 예시를 보여준 다음, 모든 이론들을 실전에 투입하는 연습을 해 보겠습니다. 그래서 마지막에는 카카오톡 클론(프런트엔드 부분) HTML 파트를 하겠습니다.
-
HTML, CSS 개념이거 공부 했더니 어때?/HTML & CSS & JS 2020. 10. 12. 05:00
이번 시간에는 HTML과 CSS에 대해 배워보도록 하겠습니다.먼저, HTML이 도대체 무엇인지에 알아볼까요?HTML은 hyper-text-markup-langauge의 줄임말로, hyper-text, 하이퍼 텍스트의 뜻은 별로 중요하지 않고, markup의 뜻이 중요합니다. 책을 읽을 때, 중요한 부분한 부분에 markup, 밑줄을 긋듯이, HTML도 밑줄을 그어 줍니다. HTML은 프로그래밍 언어가 아니라는 말이죠.우리는 엄청 길고 복잡한 코드를 작성할 때, 각각이 무엇을 뜻하는지에 대해 브라우저에게 알려주어야 합니다. 그래서 어디서부터 어디까지가 제목인지, 여기서부터 여기까지는 링크라는 것을 알려주는 것, 즉, 각각 무엇인지 알려주는 언어가 바로 HTML입니다.다시 말하자면, HTML을 통해 브라우저..
-
CSS란?이거 공부 했더니 어때?/HTML & CSS & JS 2020. 9. 16. 14:52
CSS: Cascade Style Sheet의 약자로, 웹페이지의 요소들을 꾸밀 때 사용합니다. CSS는 HTML을 HTML답게 사용할 수 있게 하고, 웹사이트를 원하는대로 꾸밀 수 있다. 즉, 정보요소와 시각요소를 분리할 수 있다.(HTML: 설계, CSS: 디자인) CSS와 HTML의 결합 1. Inline방법: 요소에 직접 적용하는 방법 2. Internal방법: head태그 내 style태그에 적용. head부분에 style을 열고 닫아줌으로써, HTML파일 상단에 CSS를 붙여주는 방법. 여러 HTML문서에 동일한 CSS를 적용하기 위해서는 복사-붙여넣기를 여러번 해야 되기 때문에, 비효율적인 방법. 3. External방법: 별도의 CSS파일을 생성. HTML문서와 CSS문서를 연결시켜, CS..
-
HTML 폼이거 공부 했더니 어때?/HTML & CSS & JS 2020. 9. 15. 23:18
HTML 폼: 정보를 입력받는데 사용되는 요소 form태그: 서버로의 정보 제출에 사용되는 문서 구획하는 태그. 서버에 입력된 정보들을 전달할 방법을 설정. 입력 양식들의 부모, 컨테이너 역할. 폼 관련 태그 외 다른 요소도 포함 가능. form태그 없이 정보 제출이 가능하지만, 활용시 유용한 점이 있음. label태그: 각 입력 양식의 라벨을 나타내는 태그. 입력 양식의 클릭 가능한 영역을 확장 input태그: 정보를 입력받는데 사용되는 태그. 속성에 따라 다양한 방식으로 정보를 받음. input태그의 속성인 type의 다양한 값 1) input ="text", "password", "tel", ...등이 입력될 때, 추가할 수 있는 속성: 2) input ="number", ...등이 입력될 때, 추..
-
HTML 디스플레이이거 공부 했더니 어때?/HTML & CSS & JS 2020. 9. 14. 14:48
HTML 디스플레이하는 방식에는 1. block요소, 2. inline요소, 3. inline-block요소가 있습니다. 1. block요소 자체적인 크기와 여백을 가짐. 부모 요소의 한 줄을 독점, (자기 너비에 관계없이)강제 줄바꿈. 일반적으로 다른 인라인 요소와 블록 요소 포함 가능. 예: div, h태그, ul, ol, li, article, section, form, p, header, footer, nav, ... 등 2. inline요소 내용부의 크기가 요소의 크기를 결정, 즉 자체적 크기가 없음. - 높이/너비/외·내부 여백 설정 불가 - 내용부의 가로, 세로 설정 불가 줄바꿈을 강제하지 않음. 일반적으로 인라인 요소와 데이터만 포함(블록요소 포함 불가능). 예: span,script, b..