blockchoin 님의 블로그

HTML과 css 만으로는 2% 부족한 나의 웹 페이지를 100%로 만드는 마지막 재료! 그건 바로 자바스크립트입니다.하지만, 자바스크립트는 기존의 HTML과 css 란은 조금은 결이 다른 언어로, 처음에는 어려울 수 있습니다. 저랑 함께 천천히 사용하는 법 배워 보겠습니다. 1단계: HTML 구조 만들기 먼저 기본적인 HTML 구조를 만들어 줍니다. 우리가 여기서 봐야 할 구조는 가 끝나기 전에 js (자바스크립트) 파일을 연결해주었다는 것입니다. 2단계: HTML 파일에 원하는 요소 설계하기 HTML 바디 안에, 원하는 기능의 형태만 넣어 주시면 됩니다. 지금은 아이디를 입력하는 창과 그 밑에 확인버튼을 만들었습니다. 실제로 실행해보면 입력 창과 버튼은 생기지만 , 입력을 하고 버튼을 눌러도 ..

안녕하세요! 오늘도 웹 페이지에 다양한 기능을 추가하고 싶은 당신! 하지만, 대부분의 기능은 자바스크립트로 이루어져 있어, 초보자들은 만들기 너무 어려운 게 현실입니다. 그렇다고, 글과 사진만으로 꾸미는 건 웹 페이지가 너무 재미 없어 지겠죠.그렇기 때문에 이번에는 HTML과 CSS 만 사용해서,많은 웹페이지에서 실제로 사용되는 인터렉티브 기능을 만들어 보겠습니다! 그 기능은 바로 "맨 위로 가는 버튼"입니다! 1. 앵커 만들기 먼저 , HTML의 body 바로 아래에 body> div id="top">div> 위와 같이 작성해 줍니다. id를 지정해 앵커의 역활을 할수 있게 이름을 지어 줍니다. 2. 버튼 만들기그리고는 body 맨끝으로가 다음과 같이 작성해 줍니다. a href="#top" cl..

HTML 연습을 위해 자신만의 웹 페이지를 처음 만들 때, 가장 어려운 부분이 있다.... 어려운 문법? 사소한 오타? 처음보는 영단어? 다 어려운 부분이지만, 가장 어려운 건... 바로, 채워도 채워도 끝이 없는 새하얀 여백이다!!! 쓸만한 글도, 넣을만한 마땅한 사진도 없을 때... 이 "구글 지도"를 하나 넣게 되면 밋밋한 웹 페이지도, 뭔가 전문적으로 보이게 된다! 이제 그럼 바로 본론으로 들어가, 구글 지도 넣는 매우 쉬운 방법을 알려주겠다. 1단계: 구글지도 접속→ https://maps.google.com Google MapsFind local businesses, view maps and get driving directions in Google Maps.www.google.com위 링..