분류 전체보기(72)
-
[Pyrhon] for문이란?
반복문인 for문에 대해서 알아보겠습니다😀 반복문이란? 특정 코드를 반복하기 위해 쓰이는 기능인데요. 어떤 경우에 활용될 수 있을까요? 예를 들어 2000부터 2021까지 연도를 출력하기 위해 print만 사용하면 1 2 3 4 5 6 7 print("2000") print("2001") print("2002") ... ... ... print("2021") cs 위와 같을 겁니다. 지금이야 범위가 넓지 않지만 만약 1 ~ 2021까지 출력한다면 위와 같이 일일이 수작업으로 코드를 쓰기에는 무리가 있겠죠? 이럴 때 활용할 수 있는 것이 반복문, for문입니다. 사용법 for문의 기본적인 사용법을 알아볼 텐데요. 1 2 3 4 5 6 7 8 9 10 for 변수명 in range(반복할 횟수) : 반복할 ..
2021.05.26 -
[Python] Python 설치법
공식 홈페이지를 통해 파이썬을 설치하는 방법을 알려드리겠습니다. 1. 공식 홈페이지에 접속 (http://www.python.org) 2. Downloads 메뉴에서 사용하는 운영체제를 선택 3. 상단의 최신 버전을 클릭 4. 사용하는 운영체제와 비트에 맞는 파일을 다운 ※ 사용할 컴퓨터의 비트를 모르겠다면? 내 컴퓨터(내 PC) 오른쪽 클릭 > 속성 > 시스템 항목에서 확인 5. 다운받은 파일을 실행 후 Add Python to PATH 체크 ( 명령 프롬프트(cmd)에서 실행하기 위해 필요) 6. 설치된 파일에서 Python 실행 7. 작동 여부 확인
2021.05.25 -
[CSS] 햄버거 메뉴 버튼 만들기
웹페이지나 모바일 메뉴에서 흔히 볼 수 있는 3줄로 구성된 모양의 햄버거 버튼입니다. 클릭 시 두 번째 줄은 투명해지고 첫 번째와 세 번째 줄이 이동하면서 각도를 바꿔 X자 형태를 만드는 원리입니다. HTML, CSS, JavaScript 를 구분해 놓고 간략한 설명을 위해 주석을 달았습니다. HTML CSS JavaScript
2021.05.23 -
[CSS] jpg파일로 움직이는 텍스트 애니메이션(text animation) 만들기
오늘은 텍스트 배경색이 움직이는 효과를 만들어보겠습니다. 사용할 이미지는 gif 처럼 동적인 파일이 아닌 jpg 파일로 스트라이프 패턴의 이미지를 사용할 건데요. stripe, stripe background 등으로 검색하시면 비슷한 이미지를 찾으실 수 있을 거예요😀 여기서 유의할 점은 스트라이프 패턴이 세로로 되어 있는 게 아닌 위와 같이 사선으로 되어 있어야 한다는 점입니다. 만약 세로 패턴의 이미지라면 각도를 돌려 사용하면 되겠네요! 먼저 완성 소스를 보여드리겠습니다. 여기서 중요한 태그는 background-clip, @keyframes, animation 정도가 되겠네요! background-clip 요소의 배경을 어디까지 차지할 지 지정하는 속성으로 아래와 같은 값을 지정할 수 있습니다. bo..
2021.05.22 -
[CSS] bootstrap 사용법
bootstrap이란? 프론트엔드 구축을 위한 프레임워크입니다. 여기서 프레임워크란 개발 전 자주 쓰이는 기능들을 미리 개발해놓은 탬플릿이라 생각하시면 됩니다. 사용 방법이 쉽고 코드를 가져다 바로 쓸 수 있어 시간 단축에 용이한 점이 있지만 내가 원하는 대로 커스터마이징이 어려울 수 있고 일반적인 탬플릿을 생각해 보면 정형화된 이미지, 딱 봐도 탬플릿을 사용한 것 같은 느낌을 줄 수 있어 bootstrap만 사용하는 것 보단 bootstrap을 통해 코드를 분석해가며 공부한 뒤 자신만의 코드를 짜 보는 방법이 베스트라 생각합니다. 사용법 1. 먼저 홈페이지에 접속합니다. https://getbootstrap.com Bootstrap The most popular HTML, CSS, and JS libr..
2021.05.19 -
[HTML] HTML 이란?
HTML Hyper Text Markup Language 웹문서의 구조를 설명하는 프로그래밍 언어의 한 종류로 여러 태그들로 구성되어 있고 태그를 사용하여 원하는 형태의 문서를 만들 수 있는 구조입니다. HTML 특징 1. 단순한 구조와 쉬운 문법 다른 프로그래밍 언어에 비해 구조와 문법이 쉬운 편이라 수정 및 관리가 용이합니다. 2. 마크업 언어 마크업 언어(Markup Language) : 문서의 중간에 문자나 문장 형태의 명령어를 삽입하는 방식의 문서 표현 언어 마크를 삽입하는 방식으로 파일의 정의하기 때문에 파일 용량이 작아 클라이언트와 서버 간에 빠른 문서 전달이 가능합니다. 3. 일반적인 텍스트 파일 별도의 전용 프로그램이 필요하지 않아 메모장과 같은 편집기도로 수정 후 즉시 적용까지 가능합니..
2021.05.14