본문 바로가기

코딩야학/HTML11

[7일차] ~코드삽입 1. 복습과 수업 예고 (https://opentutorials.org/course/1688/9364) - PHP와 JavaScript - & : CSS와, .css확장자로 작성된 css파일을 현재 HTML에 적용 - & : JavaScript와, .js확장자로 작성된 JavaScript파일을 현재 HTML에 적용 - 웹서버와 DB를 연결해주는 PHP(물론, Java(jsp), 파이썬 등등등 이 될 수도) 2. JavaScript vs PHP (https://opentutorials.org/course/1688/9365) - 협력적인 관계 - HTML & CSS : 정적인 언어. 한번 브라우저에 올라오면 변경될 수 없음. -> 문서 - JavaScript & PHP(JSP, Perl 등..) : 동적인 .. 2017. 6. 11.
[6일차] CSS 실습 1. CSS 실습 (https://opentutorials.org/course/1688/9351) 1.1 실습1 1.2 실습2 - .css 확장자를 이용해 CSS 파일을 생성 할 수 있음. - HTML head태그 하위의 style tag에서 작성하는 방법으로 css 파일을 채우면 된다. - : 작성한 CSS파일 내용을 현재 HTML에 적용. - link 태그를 이용한 CSS적용은 유지보수의 편의성과 함께, 인터넷 자원을 아낄 수 있다던가, 페이지 오픈 속도를 향상 시킬 수 있는 등. 장점이 있다. * 크롬 Stylebot이라는 확장프로그램을 이용하여 현재 웹페이지의 CSS값을 조정하여 내 입맛에 맞게 컨트롤 할 수 있다. (변경사항이 저장됨.) * JSFilddle.net : html 및 css를 작성.. 2017. 6. 11.
[5일차] CSS 이론 및 실습 1. CSS 이론 (https://opentutorials.org/course/1688/9350) 1.1 CSS의 기본문법 & 1.2 선택자 심화 학습 - CSS (Cascading Style Sheet) - HTML 언어를 디자인하기 위해 고안된 언어이므로 항상 HTML과 함께함. - HTML 정보에 집중하게 하기 위해 시각적인 기능을 가진 내용이 CSS로 만들어짐(디자인에 집중). - head태그 내부에 작성. 선택자1, 선택자2(tag나, #id 등...) {서술1; 서술2 (어떤 효과를 줄지에 대한 정보)} -> h1 {color:red; font-size:10px} : h1 tag의 내용이 빨간색으로 표시됨. {} 내부에서 줄바꿈을 해서 여러줄로 서술해도 적용된다. header h1 : head.. 2017. 6. 10.
[4일차] 개발도구 1. 개발 도구 (https://opentutorials.org/course/1688/9346) 1.1 도구의 필요성 - 개발을 위해 다양한 도구들이 존재함. 도구를 이용하면 편리하고 파워풀한 성능이 나오지만, 도구 사용을 위한 학습 시간이 필요함. - 버전 관리 시스템 : 협업에서 여러사람이 같은 파일을 수정할 때 질서를 정해주거나 개발 버전업시 문제가 발생했을 경우 다리 롤백하는 등의 기능을 제공 - SVN - GIT - 코드 편집기 - 아톰 : https://atom.io - Aptana - Sublime Text - Brackets 2.1 아톰 사용법 - 확장 프로그램 emmet을 설치하면, tag만 입력하고 TAB을 누르면 자동 완성됨. 2017. 6. 10.