HTML／CSS85 [HTML / CSS] 버튼태그, a태그로 페이지 이동하기 이번 시간에는 사이트에서 다른 페이지로 이동하는 기능을 구현해보겠습니다. 페이지 이동을 하기 위해서 html의 2가지 코드를 간단히 진행해보겠습니다. 아직 스틱코드에 즐겨찾기가 안 되어 있으시면 아래 링크에서 즐겨찾기를 해주세요 https://stickode.com/detail.html?no=2229 1. 버튼 태그 1) 현재 창에서 이동하기 버튼을 클릭하면 현재 페이지에서 다른 페이지로 이동하게 됩니다. 스틱코드로 단번에 불러와 보겠습니다. Button 2) 새 창으로 열기 버튼을 클릭하면 새 창을 열어 다른 페이지로 이동하게 됩니다. 스틱코드로 단번에 불러오겠습니다. text 2. a태그 a태그는 왜 하필 a일까요? a는 ahchor를 뜻합니다. 닻을 내린다. 즉, 어딘가에 정박한다는 뜻이지요. 웹서.. 2021. 7. 29. [HTML / CSS] 가상요소, 가상 클래스를 이용해서 아코디언 메뉴바 제작하기 스틱코드라는 플러그인과 CSS가상요소를 이용해 아코디언 메뉴바를 구현해봅시다. 스틱 코드에 등록된 코드를 간편하게 불러와서 사용해봅시다. * 가상요소를 이용해서 아코디언 메뉴바 제작하기 https://stickode.com/detail.html?no=2216 스틱코드 stickode.com ==================================================================== 가상요소, 가상 클래스란? 선택자에 추가하는 키워드로, 선택한 요소의 일부분에만 스타일을 입힐 수 있습니다 예를 들면 어떠한 요소 위에 마우스 포커스가 맞춰졌을 때, 클릭했을 때 등이 있습니다. p::first-line { color: blue; text-transform: uppercase; }.. 2021. 7. 18. [HTML / CSS] 반응형 구현해보기 스틱코드라는 플러그인을 이용해 반응형 예제를 구현해봅시다. 스틱 코드에 등록된 코드를 간편하게 불러와서 사용해봅시다. * 반응형 웹 예제 https://stickode.com/detail.html?no=2195 스틱코드 stickode.com ==================================================================== 반응형 웹 디자인이란? 하나의 웹사이트에서 PC, 스마트폰, 태블릿 PC 등 접속하는 디스플레이의 종류에 따라 화면의 크기가 자동으로 변하도록 만든 웹페이지 접근 기법을 말합니다. 반응형을 하면 무엇이 좋은가? 웹사이트를 PC용과 모바일용으로 각각 별개로 제작하지 않고, 하나의 공용 웹사이트를 만들어 다양한 디바이스에 대응할 수 있습니다. PC.. 2021. 7. 5. [HTML / CSS] 웹 프론트 drawable side menu 만들기 안녕하세요.~ 이번시간에는 웹 프론트에서 CSS를 이용해 드로어블 사이드 메뉴를 만들어 보도록 하겠습니다. 스틱코드 (stickode.com/mainlogin.html) 이번에도 역시 빠르게 만들기 위해 스틱코드 플러그인을 사용해서 만들어보겠습니다. 스틱코드는 자주쓰는 코드를 저장해서 쉽고 빠르게 사용할 수 있고, 다른사람들의 코드도 즐겨찾기를 통해 쉽게 내코드로 등록하여 사용할 수 있어 사용하는 사람이 늘어나고, 좋은 코드가 쌓일수록 강력해지는 플러그인 입니다. 이번시간에는 부트스트랩(bootstrap)도 같이 사용하여 만들어보았습니다. HTML 설정 스틱코드를 통해 HTML 코드를 설정해주도록 하겠습니다. 스틱코드를 사용하면 다음과 같이 코드가 완성됩니다. HTML 전문입니다. 메뉴 입니다. 메뉴1 .. 2021. 6. 15. 이전 1 ··· 7 8 9 10 다음
