본문 바로가기

Programming

기초코딩- HTML의 기초 (<!DOCTYPE html> <head> <body>) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 저번 글에서는 태그 A의 속성 중target이라는 속성과태그 img에 src라는 속성으로이미지를 넣는 방법에 대해알려드렸는데요. 기억이 나질 않으신다면밑에 글을 참고하세요.tm-csc.tistory.com/1140 기초코딩- HTML의 기초 (attributes -target, img tag) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 지난 글에서는 태크 a의 속성 attirbutes 중 href에 대해 알려드렸는데요. href는 원하는 링크로 이동시키기 위해 있는 태크 a의 속성이�� tm-csc.tistory.com 그럼 이어서 추가로 계속 설명해 드릴게요. 무조건 사진을 올릴 수 있는 방법은 인터넷에 있는 이미.. 더보기
기초코딩- HTML의 기초 (attributes -target, img tag) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 지난 글에서는 태크 a의 속성 attirbutes 중 href에 대해 알려드렸는데요. href는 원하는 링크로 이동시키기 위해 있는 태크 a의 속성이었죠. 만일 기억이 나지 않으신다면 지난 글에서 참고하세요. tm-csc.tistory.com/1138 기초코딩- HTML의 기초 (tag a 와 attributes) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 저번 글에서는 list tag 인 ol과 ul에 대해 알려드렸는데요 만약 잘 모르시거나 까먹으셨다면 이쪽에서 확인해주시고요. tm-csc.tistory.co tm-csc.tistory.com 그렇다면 오늘은 다른 속성 즉 target이라는 attributes에 대.. 더보기
기초코딩- HTML의 기초 (tag a 와 attributes) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 저번 글에서는 list tag 인 ol과 ul에 대해 알려드렸는데요 만약 잘 모르시거나 까먹으셨다면 이쪽에서 확인해주시고요. tm-csc.tistory.com/1137 기초코딩- HTML의 기초 (list tag ol과 ul) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 저번에 처음 사용한 h1 태그 기억나시나요? 이렇게 생겼던 거 말이죠. 저번 시간에 깜박하고 말씀 못 드린 게 있는데. h1 태크는 h6까 tm-csc.tistory.com 이번 글은 태그 a에 대해 알려드리도록 할게요. 가장 먼저 a라는 태그는 anchor 즉 닻을 뜻하는데요. 이유는 저도 정확히는 알 수 없지만 쉽게 생각해 link를 연결하는 태그.. 더보기
기초코딩- HTML의 기초 (list tag ol과 ul) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 저번에 처음 사용한 h1 태그 기억나시나요? 이렇게 생겼던 거 말이죠. 저번 시간에 깜박하고 말씀 못 드린 게 있는데. h1 태크는 h6까지는 있지만 h7은 없습니다. 이렇게 적어줬을 때 실행하게 돼도 이렇게 h7 만 적용되지 않고 단순히 텍스트로 표현되게 되죠 그럼 이번 글은 다른 태그에 대해 알려드리도록 할게요. 바로 LIST tag입니다. 웹사이트를 보다 보면 순서대로 나열된 콘텐츠들도 볼 수 있지만 순서와 상관없이 나열된 것도 볼 수 있죠 그래서 HTML의 LIST의 종류는 두 가지입니다. 첫 번째는 Ordered List 두 번째는 UnOrdered List 즉 1234처럼 차례대로 순서가 있는 목록과 정렬이 돼있지 않은 순서가 .. 더보기
기초코딩- HTML의 기초 (h1 tag) 저번 글에 이어서 계속해서 HTML에 대해 알려 드리도록 할게요. 저번에 처음 만든 웹사이트 기억하시죠? 하지만 웹사이트라고 말하기에는 조금은 초라했는데요. (웹사이트라고 저번 글만 해도 축하하더니 이제 와서???????) 왜냐하면 단지 우리는 카카오톡을 쓰듯이 그냥 TEXT만 적었기 때문이죠. 사실 제목을 설정한 것도 아니고 그 제목의 폰트 사이즈가 크거나 작게 설정한 것도 아니죠. 당연해요. 아직은 아무것도 모르니까요. 하지만 우리가 알게 된 건 어떠한 텍스트를 적게 되면 우리가 보는 컴퓨터 스크린에 무언가가 나타난다는 걸 알게 됐고요. 어떤 규칙에 의해 문장을 적지도 않았고 HTML 코드를 적지도 않았는데 브라우저는 있는 그대로 스크린에 보여줬다는 것이 정말 중요한 포인트라는 거죠. 왜냐하면 브라우.. 더보기
기초코딩- HTML부터 시작하자 웹사이트는 최소 2가지에서 최대 3가지 종류의 언어로 이루어져 있다는 거 지난 글을 보셨다면 알고 계실 거라고 생각해요. 첫 번째 언어 : HTML 두 번째 언어 : CSS 세 번째 언어 : JavaScript 혹시 제 지난 글을 못 보셨거나 해당 언어가 '무엇인지도 잘 모르겠다' 라고 생각하신다면 밑에 글을 참고하세요. tm-csc.tistory.com/1128 기초 코딩 - HTML 이란 무엇일까? 지난 글에 제가 웹사이트는 단지 Text일 뿐이라고 말한 거 기억하시나요?? 코딩은 단순히 글을 적는 것뿐이라고 말씀드렸죠. 사실 웹사이트는 최소 2가지에서 최대 3가지 종류의 Text로 이루어져 �� tm-csc.tistory.com tm-csc.tistory.com/1129 기초코딩 - CSS 이란 무.. 더보기
기초코딩 - JAVAScript 이란 무엇일까? 지난 글과 지지난 글에서 웹사이트는 최소 2가지에서 최대 3가지 종류의 언어로 이루어져 있다고 말했습니다. 첫 번째 언어 : HTML 두 번째 언어 : CSS 세 번째 언어 : JavaScript 이렇게 구성되어 있다고 말이죠. 그래서 HTML와 CSS 대해 설명드렸고 이제 JavaScript에 대해 알려드리도록 하겠습니다. HTML에 대해 궁금하신 분들은 여기를 참고하세요~~ tm-csc.tistory.com/1128 기초 코딩 - HTML 이란 무엇일까? 지난 글에 제가 웹사이트는 단지 Text일 뿐이라고 말한 거 기억하시나요?? 코딩은 단순히 글을 적는 것뿐이라고 말씀드렸죠. 사실 웹사이트는 최소 2가지에서 최대 3가지 종류의 Text로 이루어져 �� tm-csc.tistory.com CSS에 대해.. 더보기
기초코딩 - CSS 이란 무엇일까? 지난 글에서 웹사이트는 최소 2가지에서 최대 3가지 종류의 언어로 이루어져 있다고 말했습니다. 첫 번째 언어 : HTML 두 번째 언어 : CSS 세 번째 언어 : JavaScript 이렇게 구성되어 있다고 말이죠. 그래서 HTML에 대해 설명드렸고 이번 글은 바로 CSS에 대해 알려드리도록 하겠습니다. HTML에 대해 궁금하신 분들은 여기를 참고하세요~~ tm-csc.tistory.com/1128 바로 CSS 정의에 대해 살펴볼까요? 캐스케이딩 스타일 시트(Cascading Style Sheets, CSS) 종속형 시트 또는 캐스케이딩 스타일 시트는 마크업 언어가 실제 표시되는 방법을 기술하는 언어로, HTML과 XHTML에 주로 쓰이며, XML에서도 사용할 수 있다. W3C의 표준이며, 레이아웃과 스.. 더보기
기초 코딩 - HTML 이란 무엇일까? 지난 글에 제가 웹사이트는 단지 Text일 뿐이라고 말한 거 기억하시나요?? 코딩은 단순히 글을 적는 것뿐이라고 말씀드렸죠. 사실 웹사이트는 최소 2가지에서 최대 3가지 종류의 Text로 이루어져 있습니다. 정확히는 Text라는 말보다는 언어라고 말하는 게 더 정확한 말이겠죠 첫 번째 언어 : HTML 두 번째 언어 : CSS 세 번째 언어 : JavaScript 웹사이트를 구성하는 언어는 이렇게 3가지만 있기 때문에 웹 개발을 목적으로 한다면 정말 좋은 일이겠죠??? 왜냐하면 3가지만 배우면 끝이니까요. 물론 HTML CSS는 금방 습득할 수 있는 반면 JAVA는 쉽지는 않을 거예요 하지만 어려운 만큼 당신의 경쟁자로부터 당신의 보호해줄 거예요. 그럼 그중에서도 가장 첫 번째 언어 HTML은 무엇일까요.. 더보기
코딩을 위한 소프트웨어 설치-딱 3가지!! 웹사이트는 단지 Text라는 말 기억하시죠?? 그럼 이 Text를 쓰기 위해서 즉 코딩을 하기 위해 뭐가 필요할까요? 딱 3가지만 준비하시면 됩니다. (유로 아니고 무료이니까 걱정하지 않으셔도 됩니다.) 첫 번째는 바로 크롬 브라우저입니다. 크롬을 사용하는 이유는 코딩을 위해 사용하는 확장 프로그램도 많고 개발자에게 친화적이기 때문이죠. 혹시나 크롬을 다운로드 못하시는 분들을 위해 설명드리면 Google.com에 크롬이라고 검색하세요. 그 뒤에 다운로드 설치해주시면 됩니다. (요즘은 네이버에서 나온 웨일도 많이 사용하시는데 크롬 기반으로 만들어졌기 때문에 사용하셔도 되지만 이왕이면 크롬으로 설치해주시면 더 좋습니다) 두 번째는 바로 Visual Studio Code입니다. VSC를 사용하는 이유는 바로 .. 더보기