목록분류 전체보기 (108)
Keep going
깃에서는 문서를 수정할 때마다 간단한 메모와 함께 수정 내용을 스냅숏으로 찍어서 저장한다. 이것을 '버전'이라고 한다. ◆ 깃 저장소 만들기 저장소를 만들고 싶은 디렉터리로 이동해서 깃을 초기화하면 그때부터 해당 디렉터리에 있는 파일들을 버전 관리할 수 있다. # 깃 초기화하기 - git init 1. 깃 저장소를 만들 디렉터리를 하나 새로 만들고 홈 디렉터리에 hello-git이라는 디렉터리를 만든다. 그리고 cd 명령을 사용해 hello-git 디렉터리로 이동한다. 2. hello- git 디렉터리 안의 내용을 살펴보기 위해 'ls-la' 명령을 입력한다. 화면에 두줄짜리 결과가 나타날 것이다. 마침표가 하나(.)인 항목은 현재 디렉터리를 나타내고, 마침표가 두개(..)인 항목은 상위 디렉터리를 나타..
하이퍼링크는 클릭만 하면 연결된 곳으로 바로 이동해 웹 사이트를 더욱 편리하게 사용할 수 있는 중요한 기능이다. 링크를 삽입하는 태그와 href 속성 - 웹 사이트의 링크의 기능은 가장 많이 사용된다. - 링크는 태그로 만드는데, 이 때 텍스트를 사용하면 텍스트 링크가 되고, 이미지를 사용하면 이미지 링크가 된다. - 태그의 기본형은 href 속성을 이용해 연결할 파일이나 링크할 주소를 쓴다. # 텍스트 링크 만들기 - 텍스트 링크는 와 태그 사이에 링크로 만들 텍스트를 입력하고, href 속성에는 텍스트를 클릭하면 연결할 문서의 경로와 파일명을 넣으면 된다. 주문서 작성하기 cs # 이미지 링크 만들기 - 텍스트 링크를 만드는 것과 같은 방법으로 태그를 사용해 이미지에 링크를 추가할 수 있다. - 링크..
다양한 멀티미디어 파일을 삽입할 때 쓰는 , 태그 - 태그는 오디오 파일뿐만 아니라 비디오, 자바 애플릿, PDF 등 다양한 멀티미디어 파일을 삽입할 때 사용한다. - 웹 문서 안에 다른 문서를 삽입할 때도 사용할 수 있다. - data 속성에 보여 줄 멀티미디어 파일을 지정하고 width, height 속성을 사용해 플레이어의 크기를 지정한다. - 태그를 사용하여 웹 문서에 PDF 파일을 삽입하면 PDF 리더가 자동으로 포함되어 보여 준다. cs - 태그는 HTML 초기 버전부터 사용해서 대부분 브라우저에서 사용할 수 있다. - 태그에는 src 속성을 사용해 삽입할 멀티미디어 파일을 지정한다. - 필요할 경우 width, height 속성으로 플레이어의 너비와 높이를 지정할 수 있다. - 태그에는 닫는..
이미지를 삽입하는 태그 - 태그에서 알아야 할 속성은 src와 alt 이다. - src 속성은 이미지 파일의 경로를 지정하여 웹 브라우저에 알려주는 역할을 하며 반드시 있어야 한다. - alt 속성에는 화면 낭독기 등에서 이미지를 대신해서 읽어 줄 텍스트를 입력한다. 레드향 cs 웹에서 사용하는 대표적인 이미지 파일 형식 - 웹에서 사용하는 이미지는 인터넷으로 전송해야 하므로 파일 크기가 크지 않으면서 화질이 좋아야 한다. - 주로 JPG(또는 JPEG) 나 PNG 파일 형식을 사용한다. 아이콘이나 로고처럼 작은 이미지일 경우 GIF 파일을 사용하기도 한다. 종류 설명 GIF 표시할 수 있는 색상 수는 최대 256가지이다. 다른 이미지 파일 형식에 비해 파일 크기가 작아서 아이콘이나 불릿 등 작은 이미지..
깃으로 무엇을 할 수 있는가? 깃이 제공하는 핵심 기능은 크게 '버전관리', '백업', '협업' 으로 나눌 수 있다. 1. 버전 관리 깃은 수정할 때마다 언제 수정했는지, 어떤 거슬 변경했는지 편하고 구체적으로 기록하기 위한 버전 관리 시스템이다. 2. 백업하기 백업은 현재 컴퓨터에 있는 자료를 다른 컴퓨터에 복제하는 것이다. 외장 하드 디스크나 USB 디스크 등 별도의 저장 장치를 마련해서 백업을 할 수 있고 구글 드라이브 같은 인터넷 서비스를 사용하기도 한다. 백업 공간을 제공하는 인터넷 서비스 중에는 깃 파일을 위한 것도 여럿 있다. 이를 깃의 원격 저장소 또는 온라인 저장소라고 한다. 이러한 서비스 중 가장 많이 쓰이는 것이 바로 깃허브다. 3. 협업하기 깃허브와 같은 온라인 서비스를 사용하면 여..
표의 구성 요소 알아보기 - 표는 행과 열 그리고 셀로 이루어진다. - 셀은 행과 열이 만나 이루어진 곳으로 표의 내용이 들어가는 한 칸을 의미한다. - 표를 만들려면 표를 만드는 태그와 행을 만드는 태그, 열을 만드는 태그가 필요하다. 표를 만드는 , 태그 - 표의 시작과 끝을 알려 주는 과 태그를 표시하고 그 사이에 표와 관련된 태그를 모두 넣는다. - 표에 제목을 붙이고 싶다면 태그 바로 아랫줄에 태그를 사용한다. -
웹 문서에서 목록은 단순히 어떤 항목을 나열할 뿐 아니라 특히 CSS와 함께 사용해서 내비게이션을 만들거나 콘텐츠를 배치하는 등 다양한 용도로 사용한다. 순서 있는 목록을 만드는 , 태그 - 순서 있는 목록이란 말 그대로 각 항목을 순서대로 나열한 것입니다. - 순서 목록은 어떤 과정을 순서대로 설명할 때 과 태그를 사용해 만든다. - ol은 ordered list의 줄임말이고, li는 list의 줄임말이다. 상품 소개 페이지 레드향 샐러드 레시피 재료: 레드향 1개, 아보카도 1개, 토마토 1개, 샐러드 채소 30g 드레싱: 올리브유 1큰술, 레몬즙 2큰술, 꿀 1큰술, 소금 약간 샐러드 채소를 씻고 물기를 제거한 후 준비합니다. 레드향과 아보카도, 토마토를 먹기 좋은 크기를 썰어둡니다. 드레싱 재료를..
제목을 나타내는 태그 - 웹 문서에서 제목은 다른 텍스트보다 크고 진하게 표시한다. - 태그에서 h는 제목을 뜻하는 heading을 줄인 말이다. - n의 자리에는 1~6의 숫자가 들어가며 제목 텍스트를 크기별로 표시할 수 있다. 상품 소개 페이지 레드향 레드향 샐러드 레시피 상품 구성 cs 텍스트 단락을 만드는 태그 , 줄을 바꾸는 태그 - 와 태그 사이에 택스트를 입력하면 텍스트 앞뒤로 빈 줄이 생기면서 텍스트 단락이 만들어진다. - 편집기의 태그안에서 줄을 바꾸더라도 웹 브라우저에서는 한줄로 표시된다. 그렇다면 텍스트 단락을 만들 때 원하는 위치에 줄을 바꾸려면 어떻게 해야하는가? - 태그를 사용하면 줄을 바꿀 수 있다. - 태그는 단독으로 사용하므로 닫는 태그가 필요 없다. 상품 소개 페이지 레드..