CSS 속성을 스스로 알아내는 방법 - 생활코딩 강의 소스코드 변경사항 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. 1. Property 프로퍼티란 CSS에서 적용할 효과의 종류를 뜻하는 용어다. 모든 프로퍼티를 외워서 사용하기는 어렵고 비효율적이니깐 검색해서 사용하는 법을 배워야 한다. 검색창에 “css ??? property”라고 입력하면 대부분 적절한 프로퍼티를 추천해 줄 것이다. 가. 예시 : 글자 크기 구글에 “css text size property” 검색하면 해당 사이트를 추천받을 것이다. CSS font-size property W3Schools offers free online tutorials, references and exercis..

CSS 등장 이전의 상황 - 생활코딩 수업예고 HTML은 정보를 표현하기 위해서 고안된 언어입니다. 하지만 사람들은 정보만으로는 못산다고 불평을 쏟아내기 시작하는데.... 강의 소스코드 변경사항 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. CSS 소개 CSS(Cascading Style Sheets, CSS)는 마크업 언어가 실제 표시되는 방법을 기술하는 스타일 언어(style sheet language)다. HTML 구조는 그대로 두고 CSS 파일만 변경해도 전혀 다른 웹사이트처럼 꾸밀 수 있다. W3C의 표준이며, 레이아웃과 스타일을 정의할 때의 자유도가 높다. 기본 파일명 style.css이다. 출처 : https://ko.wikipedia.org..

부록 : 코드의 힘 - 동영상 삽입 - 생활코딩 소스코드 변경사항 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. 동영상 넣기 유튜브 영상을 추가하고자 한다면… 영상 하단에 공유 버튼을 누른다. 퍼가기(혹은 소스)를 누른다. 이제 HTML 태그로 된 코드를 원하는 단락에 복사해서 붙여 넣으면 된다. ... 그 외 강의에는 동영상을 넣는 것 이외에도 다른 기능을 소개한다. 댓글 기능 추가하기 채팅 기능 추가하기 방문자 분석기 3가지 강의 내용은 만약에 필요한 날이 오면 그때 다시 공부하도록 하자. 여담 요 며칠 새 독립한다고 시간이 없었다. 본격적으로 본가에서 나와서 독립하기로 했다. 학교 근처에 집을 구하고 청소를 했다. 또 필요한 물건을 서서 채워 넣다 ..

인터넷에서 웹이 동작하는 기본적인 원리 인터넷이 동작하려면 최소 2대의 컴퓨터가 필요하다. 역할에 따라서 서버와 클라이언트로 부른다. 따라서 웹이 인터넷에서 동작하려면 웹 클라이언트와 웹 서버가 필요하다. 인터넷에서 웹이 동작하는 과정을 살펴보자. 웹 브라우저를 설치한 클라이언트에서 인터넷을 통해 웹 서버에 접속한다. 클라이언트가 서버에 index.html 파일을 요청(request)한다. 웹 서버는 저장장치에서 index.html이라는 파일을 찾아서 클라이언트로 전송한다. 클라이언트의 웹 브라우저는 수신한 index.html이라는 파일의 코드를 읽고 해석한다. 웹 브라우저의 화면에 보여준다. 이미지 출처 : https://youtu.be/yBPyzaccbkc 웹 서버를 운영하는 하는 방법은 크게 2가지..

https://opentutorials.org/course/3084/18418 HTML 태그의 제왕 - 생활코딩 우리는 지금까지 문서를 만드는 방법을 충분히 자세히 살펴봤습니다. 태그를 결합하는 방법을 완전히 마스터했고, 빈도수가 절대적으로 높은 태그들을 살펴봤습니다. 앞으로 배울 것 보다, 지 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. a tag 지금의 웹을 만든 중요한 태그가 있다. 웹과 웹이 서로 연결하는 태그가 그것이다. text href : Hypertext + reference 자주 쓰는 형식은…. text target=”_blank” : 새 탭으로 열기 title=”…” : 커서가 위에 있을 때 표시되는 정보 출처를 표시하기 위해서 나무위..

https://opentutorials.org/course/3084/18488 HTML이 중요한 이유 - 생활코딩 --- 누구나 기초가 중요하다고 말합니다. 하지만 기초가 중요하다는 말을 잘 들어보면 응용으로 가는 과정으로서 기초가 중요하다는 뜻인 경우도 많더라구요. 그런데 사실 기초는 기초만으로도 opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. HTML을 의미에 맞게 사용한다는 것 중요하다. 검색 엔진은 웹 페이지에 담긴 html 코드를 분석한다. 태그에 근거해서 정리 정돈한다. 현대 사회에서 검색 엔진의 위상을 고려해 볼 html의 의미에 맞게 사용한다는 것은 비즈니스 측면에서 중요하다. 또 신체적 장애가 있는 분들이 사용하는 청각화 장비도 html을 ..

HTML 코딩 실습 환경 준비 - 생활코딩 HTML 코딩 실습 환경 준비 - 생활코딩 --- 기획이 끝났으니 이제는 코딩하기 위한 준비를 해보겠습니다. 코딩을 하기 위해서는 에디터(Editor)라는 프로그램이 필요합니다. 각자의 운영체제에는 이미 에디터가 준비 되어 있습니다. opentutorials.org 이 글은 이고잉님의 오픈튜토리얼 강의를 듣고 정리한 내용입니다. 준비 강의에서는 atom editor로 진행하지만, 나는 vs code를 사용하기로 했다. 바탕화면에 web이라는 디렉터리를 만든다. 프로젝트에 사용할 파일은 이곳에 저장한다. 강의 목표 오픈 튜토리얼 html 강의의 목표는 아래와 같은 웹 페이지를 만드는 것이다. 강의에서 이고잉 선생님이 … 우리 수업에서 강조하는 부분은 자기 자신을 ..

웹 개발을 위한 vscode setting 비쥬얼 스튜디오 코드 설치 및 웹개발을 위한 필수 익스텐션 10개 추천 | 프론트엔드 개발자 입문편: HTML, CSS, Javascript 시작할 때 알면 좋은 것 ⇧+⌘+P : 상단에 명령 팔레트 창을 연다. html:5 + tab : .html 파일을 처음 만들었을 때 기본 형식을 완성해준다. ⌘L ⌘O: 명령 팔레트 >live Server : open with live server 단축키 시작 오픈튜토리얼은 https://opentutorials.org/course/3084에서 배울 예정이다. 하핫. 책까지 사버렸다.