생활코딩 (32) 썸네일형 리스트형 3일차 : CSS 선택자를 스스로 알아내는 법 3일차 : CSS 선택자를 스스로 알아내는 법 지난 시간에는 CSS 속성을 알아내는 법을 배웠는데, 이번에는 CSS 선택자를 알아내는 법에 대해 공부합니다. 선생님께서 내용이 많고 복잡하다고 미리 경고를 하고 있어요! 시작도 전에 두려워지는군요.. 시간을 충분히 확보하라는데.. 시간은 많으니 시작해보죠! ○ 선택자란? 지난 시간에 style 태그에 등장한 a 가 선택자였습니다. 즉, 속성을 적용시킬 대상이 선택자였죠. 선택자가 간단하게 a와 같이 하나의 속성을 갖고 있는 경우, CSS 선택자를 입력할 때 그냥 그 속성만 입력하면 됩니다. 지난 시간에 a를 입력하여 모든 하이퍼링크들의 글자 색상이나 밑줄 여부를 한꺼번에 적용시켜줄 수 있었죠. ○ 전체가 아니라 몇 가지 태그만 변경해주고 싶다면?? 선택자를.. 2일차 : 혁명적 변화, CSS 속성 알아내는 법 2일차 : 혁명적 변화, CSS 속성 알아내는 법 지난 시간에 CSS가 등장하게 된 배경에 대해 살펴보았습니다. 이번에는 조금 더 구체적으로, CSS를 사용하는 방법에 대해 알아볼 예정입니다. ○ 웹 페이지에서 CSS를 적용하는 두 가지 방법 1. style 태그를 이용 style 태그는 지난 시간에 살짝 살펴보았습니다. 이처럼 을 입력한 후, 속성을 적용시킬 대상 (a) 을 선택하고, 적용시킬 효과 (color=색상;) 를 적어주면 됩니다. a 태그를 달고 있는 모든 곳에 동일한 속성을 한 번에 적용시키는 것이죠. 여러가지 속성을 한꺼번에 변경시킬 때 유용하게 사용할 수 있는 것이 바로 이 스타일 태그입니다. 그렇다면, 이 중에 하나만 변경하고 싶을 때는 어떻게 할까요? 2. style 속성을 이용 바.. 1일차 : 수업소개 ~ CSS의 등장 1일차 : 수업소개 ~ CSS의 등장 WEB1 HTML과 INTERNET을 마치고 WEB2 CSS로 넘어왔습니다. ○ CSS란? HTML을 통해 정보를 표현하게 된 사람들은 이제 디자인을 신경쓰게 되었는데요. 사람들은 웹페이지를 아름답게 만들기 위해 두 가지 방법을 생각해 냈습니다. 1. 쉬운 길 : HTML에 디자인에 대한 새로운 태그를 추가 2. 어려운 길 : 디자인을 표현할 수 있는 새로운 언어를 개발 ○ 쉬운 길 CSS가 등장하기 이전에는 1번 쉬운 길인 태그를 통해 문자의 디자인을 변경해 주었습니다. 예를 들어, font 태그를 이용하면 문자의 색을 변경할 수 있습니다. 위처럼 문구 이렇게 설정하여 색을 변경하면 됩니다. 웹이 태어난 직후에 HTML에는 이처럼 디자인을 위한 코드가 대거 추가됩니.. 8일차 : 웹서버 운영하기 (윈도우) 너무 오랜만의 포스팅이네요..ㅎ 그 사이 생활코딩 웹호스팅과 웹서버 부분도 2022년 수정판이 업로드 되었습니다. (7일차라고 쓰고 7개월 전이라고 읽는다..) 7일차 웹호스팅 부분에서 웹서버를 만드는 것은 어렵다고 했는데, 8일차에 바로 웹서버 운영하는 것을 배우다니..ㅎ 우리가 사용할 소프트웨어는 Web Server for Chrome입니다. . (크롬이 없는 분들은 먼저 크롬을 깔아주세요!) 이름에서 알 수 있듯 크롬 확장프로그램이고, 설치 후 실행하면 이런 화면이 나옵니다. 여기서 CHOOSE FOLDER를 누르고 바탕화면에 만들어 두었던 WEB 폴더를 선택합니다. 그 후에 아래에 있는 URL에 접속하면, 폴더 안에 있는 웹페이지에 접속이 가능해집니다! 전에는 파일 이름으로 접속을 했는데, 이제 .. 7일차 : 웹 호스팅 7일차 : 웹 호스팅 지난 시간에 웹서버를 직접 만드는 것은 어려우니, 웹호스팅 업체를 이용하라고 했죠. 웹서버를 운영하려면 우선 컴퓨터가 있어야 하고, 그 컴퓨터가 항상 켜져 있어야 합니다. 웹서버라는 프로그램을 배워서 설치해야 하고, 인터넷을 통해 정보를 외부로 전송할 수 있게 설정해야 합니다. 따라서 초보자가 쉽게 운영할 수 없죠..ㅠ 그래서 오늘은 웹서버를 빌려주는, 웹호스팅 업체를 통해 외부에서도 접속 가능한 웹사이트를 만들어 봅시다! ** 생활코딩에 나와있는 설명/캡쳐는 예전 깃허브를 보여주는 내용이라 생활코딩만 보면 똑같은게 없어서 당황하실 수 있어요. 오래 전에 업로드 된 내용이라서, 깃허브 페이지 생김새가 좀 달라졌거든요. 아래 캡쳐들은 실시간 깃허브의 모습이니 참고하세요 :) *** 생.. 6일차 : 원시웹, 인터넷과 웹, 서버와 클라이언트 6일차 : 원시웹, 인터넷과 웹, 서버와 클라이언트 1. 인터넷과 웹? 인터넷 : 웹 = 도시 : 건물 = 도로 : 자동차 = 운영체제 : 앱 웹이 탄생하면서 일반인도 쉽게 인터넷을 사용할 수 있게 됨 2. 정보기술 역사상 중요한 사건 2개 - (1960) 인터넷의 탄생 : 핵공격을 당하면 통신이 마비되는 위험을 극복하기 위해 분산된 형태의 통신 시스템을 구상 - (1990) 웹의 탄생 : 스위스의 유럽입자물리 연구소에 도착한 팀 버너스 리가 조용히 WWW를 만듬 세계 최초의 웹 페이지 : http://info.cern.ch 원시웹 : 지난 시간까지 직접 만들어 본 바로 그 웹사이트! 3. 서버와 클라이언트 인터넷이 동작하기 위해서는 컴퓨터가 2대 필요합니다. 한 컴퓨터는 정보를 요청하고 다른 컴퓨터는 .. 이전 1 2 3 4 5 6 다음