3일만에 끝내는 HTML, CSS, JS 기초

HTML 링크 HTML 에서 다른 문서나 그림 등을 링크로 사용할 때는 태그를 사용합니다. 여기서 href 속성에 이동하려는 주소를 넣습니다. link text 이때 링크를 갖는 글자(네이버)는 눈에 보이는 부분입니다. 링크 글자를 클릭하면, 링크된 주소로 이동합니다. 링크 글자는 반드시 글자일 필요는 없고, 이미지 일 수도 있고, 다른 태그 일수 도 있습니다. 네이버 위 예제는 절대 URL 주소입니다.(인터넷 상에 고정된 주소) 반면 동일한 사이트 내에서는 상태 URL 주소를 사용합니다. 즉 "http://www.site_name.com/folder_name/" 부분이 없고 그 아래의 상대적인 경로만 적습니다. HTML Images 링크 위로 마우스가 올라가면 두가지 변화가 생깁니다. 마우스 화살표가 ..

HTML CSS 스타일 CSS 는 Cascading Style Sheets 의 두문자어 입니다. HTML 태그에 스타일을 적용할 수 있는 스타일 모음이라고 생각할 수 있겠습니다. HTML 태그에 스타일을 적용하는 방법은 3가지가 있습니다. 1. 태그내(인라인) : HTML 태그 내에 직접 스타일 속성을 사용하는 방법 2. 페이지 내부(인터널) : 여기에 머리글을 적고 여기 내용을 적는데, 위에 정의한 스타일이 적용됩니다. 단, tistory.com 사이트에서는 그 사이트 자체의 css 파일도 적용되므로, 이 예제에서는 위의 스타일이 정확히 적용되지는 않을 수 있습니다. 여기에 머리글을 적고 여기 내용을 적는데, 위에 정의한 스타일이 적용됩니다. 단, tistory.com 사이트에서는 그 사이트 자체의 c..

HTML 프로그래밍 코드 표시 HTML 은 일반적으로 알파벳의 각 문자별로 크기와 간격을 다양하게 표시할 수 있습니다. 그러나 프로그래밍 코드를 표시할 때는 고정된 글자 크기와 간격으로 표현하는 것이 좋습니다. , , 및 태그는 고정된 글자 크기와 글자 간격으로 표시합니다. File > Open... File > Open... 태그는 프로그래밍 결과를 표시하는데 사용합니다: yourid.tistory.com login: Jan 15 13:26:17 Set-up Android SDK path to make Android remote work yourid.tistory.com login: Jan 15 13:26:17 Set-up Android SDK path to make Android remote work..

HTML 인용문 태그들 태그는 인용문("인용문")으로 표시합니다. 다음 글은 인터넷에서 인용하였습니다: 월드 와이드 웹은 인터넷에 연결된 컴퓨터들을 통해 사람들이 정보를 공유할 수 있는 전 세계적인 정보 공간을 말한다. 다음 글은 인터넷에서 인용하였습니다: 월드 와이드 웹은 인터넷에 연결된 컴퓨터들을 통해 사람들이 정보를 공유할 수 있는 전 세계적인 정보 공간을 말한다. 태그는 문단을 들여쓰기하여 표시합니다. 월드 와이드 웹(World Wide Web, WWW, W3)은 인터넷에 연결된 컴퓨터들을 통해 사람들이 정보를 공유할 수 있는 전 세계적인 정보 공간을 말한다. 간단히 웹(Web)이라 부르는 경우가 많다. 이 용어는 인터넷과 동의어로 쓰이는 경우가 많으나 엄격히 말해 서로 다른 개념이다. 웹은 전자..

HTML 텍스트 태그들 태그로 글자를 굵게 합니다. 일반 글자 굵게한 경우 일반 글자 굵게한 경우 태그는 글자를 강하게 합니다. 강조한 경우 강조한 경우 태그는 이탤릭 글자를 표시합니다. 이탤릭 글자 이탤릭 글자 태그는 텍스트를 강조할 때 사용합니다. 강조된 글자 강조된 글자 이나 은 와 와 비슷해 보이나, 이 텍스트는 "중요하다"는 의미를 가지고 있습니다. 태그는 작은 글꼴로 표시해 줍니다. HTML(hypertext markup language)은 hypertext markup language의 줄임말입니다. HTML(hypertext markup language)은 hypertext markup language의 줄임말입니다. 태그는 형광색칠 또는 하이라이트된 글자로 표시합니다. 글자에 형광색칠 하..

HTML 스타일 속성 HTML 스타일 속성은 아래와 같은 문법을 사용합니다. style="속성:값;" 스타일은 CSS 에서 왔는데, CSS는 뒤에 자세히 나옵니다. background-color 속성은 배경 색상을 지정합니다. color 속성은 글자의 색상을 지정합니다. 파란색 글자 녹색 글자 파란색 글자 녹색 글자 font-family 속성으로 글꼴을 지정합니다. 바탕 글꼴입니다. 맑은 고딕 글꼴입니다. 바탕 글꼴입니다. 맑은 고딕 글꼴입니다. font-size 속성은 글자 크기를 지정합니다. h3 글자 크기 300% h3 글자 크기 80% h3 글자 크기 300% h3 글자 크기 80% text-align 속성으로 글자의 수평 정렬을 지정합니다. 가운데 정렬 가운데 정렬 [광고] Udemy 동영상 강..

HTML 기본 태그들 모든 HTML 문서는 타입선언으로부터 시작합니다. HTML 문서는 로 시작해서 로 끝납니다. 화면에 보일 부분은 와 사이에 들어갑니다. 화면에 보이는 부분 HTML 머리글은 에서 태그까지가 있습니다. 머리글 크기 1 머리글 크기 2 머리글 크기 3 머리글 크기 4 머리글 크기 5 머리글 크기 6 머리글 크기 1 머리글 크기 2 머리글 크기 3 머리글 크기 4 머리글 크기 5 머리글 크기 6 HTML 문단은 태그를 사용합니다. 문단 1입니다... 문단 2입니다... 문단 1입니다... 문단 2입니다... HTML 링크는 태그를 사용합니다. 내용 네이버 뉴스 내용 네이버 뉴스 HTML 그림 삽입은 태그를 사용합니다. HTML 줄바꿈은 태그를 사용합니다. 첫 번째 줄 두 번째 줄 세 번째..

티스토리 블로그 관리자 메뉴 활용하기 1. 관리자 메뉴로 들어가기 위해 먼저 메뉴에서 관리를 클릭 합니다. 로그인 하면 관리자 화면이 나타납니다. 여기서 자주사용하게 될 메뉴는 글 목록, 카테고리 설정, 스킨, 플러그인 설정, 방문자 통계, 기본 정보 등이 되겠습니다. 이중에서 글을 남기기 위해 먼저 카테고리를 설정해 보겠습니다. 필수는 아닙니다만, 무엇이든 분류해 놓는 것이 나중에 편리해 질 수 있습니다. 관리자 매뉴 글 목록, 카테고리 설정, 스킨, 플러그인 설정, 방문자 통계, 기본 정보 등 글을 남기기 전에 먼저 카테고리를 설정 관리자 매뉴 글 목록, 카테고리 설정, 스킨, 플러그인 설정, 방문자 통계, 기본 정보 등 글을 남기기 전에 먼저 카테고리를 설정 2. 카테고리 설정에서, 추가를 클릭하여..

티스토리 스마트폰 앱 블로그 만들기 1. 티스토리 스마트폰 앱 내블로그에서, 우측의 플러스 버튼을 클릭합니다. 블로그 이름과 블로그 주소를 입력합니다. 블로그 만들기를 클릭하여 블로그를 생성합니다. 블로그 만들기 블로그 이름과 블로그 주소 입력 블로그 생성 끝. 블로그 만들기 블로그 이름과 블로그 주소 입력 블로그 생성 끝. 2. 그 다음 웹브라우저를 띄웁니다. 크롬, 인터넷익스플로러, 사파리, 파이어폭스 어떤 것이든 관계가 없습니다. 다만, 버전이 너무 낮으면 오류가 있을 수 있으니 최신 버전의 브라우저를 사용합니다. 자신의주소.tistory.com 사이트로 이동합니다. 로그인 합니다. 자신이 만든 주소로 바꿉니다. 기본 화면이 보이지만, 아직 내용은 하나도 없는 상태입니다. 브라우저에서 자신만의 티스..

티스토리 스마트폰 앱 설치하기 1. 아이폰에서는 앱스토어를 실행시킵니다. 검색에서 티스토리를 칩니다. "티스토리 - TISTORY" 가 검색되면 클릭하여 설치합니다. 설치가 끝나면 열기 버튼을 클릭하여 티스토리 앱을 실행합니다. 아이폰에서 티스토리 앱 설치하기 앱스토어에서 티스토리를 칩니다. 검색된 티스토리를 설치합니다. 티스토리 앱을 실행합니다. 아이폰에서 티스토리 앱 설치하기 앱스토어에서 티스토리를 칩니다. 검색된 티스토리를 설치합니다. 티스토리 앱을 실행합니다. 2. 안드로이드 폰에서는 플레이스토어를 실행시킵니다. 검색에서 티스토리를 칩니다. "티스토리 - TISTORY" (Kakao Corp.) 를 선택하여 설치합니다. 설치가 끝나면 열기를 클릭하여, 앱을 실행시킵니다. 안드로이드폰에서 티스토리 ..