전체 글(80)
-
[Python] sum함수로 1부터 입력한 값까지 더하여 출력하기
input을 통해 입력값을 받고 sum함수로 1부터 입력한 값까지 합하고 print로 결과를 출력하도록 하겠습니다😀 반복문인 for문으로 1부터 입력받는 숫자(n)까지 반복하도록 하고 실행할 문장은 1부터 n까지 각각의 숫자를 더하는 방식으로 방향을 잡았습니다. 1 2 3 4 5 6 7 n = int(input()) sum = 0 for i in range(1, n+1) : sum = sum + i print(sum) cs 한 줄씩 살펴보겠습니다. 1 n = int(input()) cs n이라는 변수에 input함수로 입력값을 받을 수 있게 했고 input함수는 문자열로 입력받기 때문에 int함수를 이용해 정수로 변환시켰습니다. 1 sum = 0 cs sum이라는 변수에 0을 지정해 int 속성의 정수임..
2021.05.28 -
[Pyrhon] for문으로 입력한 숫자만큼 출력하기
반복문인 for문을 활용해 숫자를 입력받은 숫자만큼 출력할 겁니다😀 1 2 3 4 5 6 7 8 9 10 count = int(input("반복할 숫자를 입력하세요 : ")) for i in range(count) : print("hello world!") # 결과값 # 반복할 숫자를 입력하세요 : 3 # hello world! # hello world! # hello world! cs 위의 소스를 풀이해 보면 count 라는 변수에 input 을 통해 입력 값을 받고 int 와 소괄호( ) 로 묶어 문자열을 정수로 변환합니다. 코드를 실행하게 되면 "반복할 숫자를 입력하세요 : " 문자를 출력한 뒤 입력 값을 받고 count 에 넣습니다. for문에서 range 함수를 통해 count 에 들어간 값 만..
2021.05.26 -
[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