STUDY
-
[HTML] HTML의 모든 것 - (6) Graphics(Canvas, SVG), MultiMedia(video, audio, YouTube)STUDY/HTML.CSS.JS 2021. 3. 6. 20:24
HTML Canvas Graphics HTML SVG Graphics HTML Multimedia HTML API HTML Canvas Graphics HTML의 Canvas 요소는 웹 페이지에 그래픽을 그리는 데 사용된다. 에 대해 더 많이, 자세히 배우고 싶다면 HTML Canvas Tutorial을 참고! HTML Canvas란? 는 JavaScript를 사용하여 즉석에서 그래픽을 그리는 데 사용된다. 는 오직 그래픽만을 위한 컨테이너이다! 그래픽을 실제로 그리기 위해서는 반드시 JavaScript를 이용해야 한다. Canvas는 경로 그리기, 박스, 원, 텍스트와 이미지 추가하기 등의 기능을 가지고 있다. Canvas의 기능을 모두 지원하는 브라우저 버전 Canvas Example Canvas는 ..
-
[HTML] HTML의 모든 것 - (5) FormSTUDY/HTML.CSS.JS 2021. 3. 5. 15:39
Element Form Attirbute Input Attributes Form Attribute Form은 HTML에서 사용자의 입력을 처리할때 사용된다. 입력들은 처리를 위해 대부분 서버로 전송된다! Element 태그는 HTML 에서 사용자의 입력을 위한 양식을 만들때 사용한다. 태그는 텍스트, 체크박스, 라디오 버튼, 제출 버튼 등 다양한 입력 태그들을 내부에 포함한다. 1. HTML에서 input 태그는 가장 많이 사용되는 form이다. input 태그는 속성에 따라 다양한 방식으로 표현될 수 있다. Displays a single-line text input field Displays a radio button (for selecting one of many choices) Displays a..
-
[HTML] HTML의 모든 것 - (4)Semantic element, Encoding, URL, HTML vs XHTMLSTUDY/HTML.CSS.JS 2021. 3. 5. 12:52
Semantic Elements HTML Encoding (Character Sets) HTML URL(Uniform Resource Locators) HTML vs XHTML Semantic Elements Semantic 요소는 의미가 있는 요소를 말한다. Semantic 요소는 브라우저와 개발자 모두에게 명확하게 의미를 묘사하는 element이다. Semantic 요소들을 사용해야하는 이유는, Semantic 웹을 사용하면 어플리케이션이나 기업, 커뮤니티간 데이터를 공유하고 재사용할 수 있게 해주기 때문이다. Non -Semantic 요소의 예는 , 등이다. 이 태그만 보고서는 아무런 정보를 얻을 수 없다. Semantic 요소는 ,, 등이 있다. 이러한 태그들은 태그의 이름만 보고 어떤 태그들인지..
-
[HTML] HTML의 모든 것 - (3) class, id, iframes, javascript, file path, layoutSTUDY/HTML.CSS.JS 2021. 3. 4. 14:23
Class Attribute Id Attribute Iframes JavaScript File Paths Head Element Layout Elements and Techniques Responsive Web Design Computer Code Elements Class Attribute - class 속성은 HTML 요소의 class를 특정하는데 사용한다. 여러개의 HTML요소들이 동일한 class를 공유할수 있다. - class 속성은 주로 스타일 시트의 클래스를 가리키는데(구분하는데) 사용된다. 그리고 Javascript에서 동작을 조작하는 요소들을 구분짓기 위해서 class 속성을 사용하기도 한다. - class를 생성하기 위해선 '.'와 클래스의 이름을 입력한다. (ex: .city) 그 다..
-
[HTML] HTML의 모든 것 - (2)CSS, Links, Image , Table, List, Block&InlineSTUDY/HTML.CSS.JS 2021. 3. 3. 15:40
CSS Links Image Table List HTML Block and Inline Elements CSS CSS는 Cascading Style Sheets의 약자로 웹 페이지의 레이아웃 형식을 지정하는 데 사용한다. CSS를 사용하여 색깔, 글씨체, 크기, 간격, 위치, 화면 크기 등을 조절할 수 있다. Note : Cascading이라는 의미는, 부모 element에 적용된 스타일이 자식의 모든 element에도 적용됨을 의미한다. 예를 들어 body의 배경을 파란색으로 하면, 모든 heading, paragraph, 다른 모든 텍스트 element들이 파란색으로 적용된다. 1. CSS를 사용하는 방법 Inline - HTML element 내부에서 사용 A Blue Heading Internal..
-
[HTML] HTML의 모든 것 - (1)HTML, 기본 문법,Attribute, Heading, Style, Text, ColorsSTUDY/HTML.CSS.JS 2021. 3. 3. 14:36
빠른 검색 HTML 웹 페이지 HTML 기본 문법 Attribute Heading과 Paragraphs Styles Text Formating Colors HTML HTML은 HyperText Markup Language의 약자로, HyperText(웹 페이지에서 다른 페이지로 이동할 수 있게 하는 것)를 가장 중요한 특징으로 하고, Makrup이라는 형식을 가진 컴퓨터 프로그래밍 언어라는 뜻이다. 프로그래밍 언어는 컴퓨터와 사람 간의 약속이다. 그 중에서도 이 HTML은 웹 브라우저와 사람 간 서로가 이해할 수 있는 언어이다. 웹 페이지 웹 페이지는 World Wide Web(WWW, W3)에 있는 개개의 문서를 말한다. 웹 페이지는 .html 혹은 .htm 이라는 확장자 포맷을 가지고 있다. HTML..
-
Git - 7. 원격 저장소 GithubSTUDY/Git & Github 2021. 1. 11. 19:37
#이 글은 "생활코딩" '프로젝트 관리' 강의를 기반으로 정리한 글 입니다. 이제야 드디어 Github에 대한 내용을 언급하게되었습니다..! 저는 이 Github를 사용하기 위해 git을 공부하기 시작하게 되었습니다. 학교 과제로 진행한 팀프로젝트를 진행하면서도, Github의 필요성을 크게 느꼈고, 다양한 동아리나 회사 등에서도 Github 사용 경험을 요구하는 곳들이 많이 존재하기 때문이었습니다. 무작정 Github을 시작해본 적도 있지만, 번번이 실패했는데 이번에 이렇게 git을 공부하고 사용하니 확실히 더 유용하게 사용할 수 있을 것 같습니다. 이제 Githb에 대해 알아보도록 하죠! Github 란? Github는 Git을 기반으로 소스코드를 관리하고, 개발자들 간 협업 지원 등의 기능을 지원하..
-
Git - 6.2 Git의 원리(part.2) Merge & Conflict, 3-way MergeSTUDY/Git & Github 2021. 1. 8. 15:18
#이 글은 "생활코딩" '프로젝트 관리' 강의를 기반으로 정리한 글 입니다. 이번글은 Git의 원리 마지막 글로, Merge와 Conflict 그리고 3-way Merge에 대해 알아보도록 하겠습니다. Merge & Conflict Merge 시, confilct가 발생하는 상황을 만들고, 이를 어떻게 해결하는가를 같이 한번 알아보도록 하겠습니다. 역시 이번에도 연습을 위해, 새로운 디렉토리를 하나 생성해주시고, git init을 해줍니다. 그리고 역시나 동일하게 f1.txt를 생성합니다. 이번에는 아주 간단한 함수를 하나 만들어줍니다. 그리고 git add f1.txt , git commit -m "1"로 새로운 버전을 하나 생성합니다. /* f1.txt */ function () { return 'c..