생각하다 생각하다

기본 문법 @media (조건) { 스타일 } 예1) 좁은 화면 스타일링 800px 이하의 좁은 화면에서 특정 엘리먼트의 배경색을 토마토 색으로 바꾸고 싶다면, 좁은 화면에서 배경색이 토마토 색이 됨 아래와 같이 max-width 속성을 이용해서 미디어 쿼리를 작성하면 된다. @media (max-width: 800px) { .small-tomato { background-color: tomato; } } 예2) 넓은 화면 스타일링 800px 이상의 넓은 화면에서 특정 엘리먼트의 글자색을 토마토 색으로 바꾸고 싶다면, 넓은 화면에서는 글자색이 토마토 색으로 됨 아래와 같이 min-width 속성을 이용해서 미디어 쿼리를 작성하면 된다. @media (min-width: 800px) { .large-to..

justify-content 1. display 2. justify-content 3. align-items justify 사용 조건 1. 적용시킬 엘리먼트를 하나의 부모로 감싼다. 엘리먼트1 엘리먼트2 2. 부모 엘리먼트에는 display: flex 속성이 반드시 존재해야 한다. .container { display: flex; justify-content: space-between; } center : 중앙 정렬 space-between : 사이드 정렬 space-around : 두 엘리먼트에 일정한 간격을 준 정렬 flex-direction column : 수직 정렬 column-reverse : 엘리먼트 순서가 반전된 수직 정렬 row : 수평 정렬 row-r..

Text-align : block 요소 안의 inline 요소에만 적용할 수 있음 - text-align : right 오른쪽 정렬 - text-align : left 왼쪽 정렬 - text-align : center 중앙 정렬 - text-align : justify 왼쪽과 오른쪽 열에 맞추어 화면을 늘어뜨림

/* 부모 컨테이너 band */ .band { width: 90%; max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: 1fr; grid-template-rows: auto; grid-gap: 20px; } max-width: 최대 너비 width: 너비 display: 그리드 사용 gird grid-template-columns: 화면 가로 길이 gird-template-rows: 화면 세로 길이, auto : 아이템 개수만큼 늘어나도록 grid-gap: 아이템 간 간격 /* 휴대폰 화면 */ @media screen and (max-width: 500px){ .band { grid-template-columns: 1fr ..

2667번: 단지번호붙이기 과 같이 정사각형 모양의 지도가 있다. 1은 집이 있는 곳을, 0은 집이 없는 곳을 나타낸다. 철수는 이 지도를 가지고 연결된 집의 모임인 단지를 정의하고, 단지에 번호를 붙이려 한다. 여 www.acmicpc.net >문제 >접근방법 그래프 전체를 탐색하면서 1인 부분은 재귀적 깊이우선탐색을 수행한다. 한 단지를 다 탐색하면 집의 수를 리스트에 추가하고 sort로 오름차순으로 정렬해준다. 여기서 리스트의 길이가 곧 단지의 수가 된다. >풀이법 주석으로 대체 >코드 import sys # 런타임 에러(재귀 에러) 예방을 위해 재귀에 제한을 줌 sys.setrecursionlimit(10**6) input = sys.stdin.readline # 상하좌우 탐색용 인덱스 변수 d..

11724번: 연결 요소의 개수 첫째 줄에 정점의 개수 N과 간선의 개수 M이 주어진다. (1 ≤ N ≤ 1,000, 0 ≤ M ≤ N×(N-1)/2) 둘째 줄부터 M개의 줄에 간선의 양 끝점 u와 v가 주어진다. (1 ≤ u, v ≤ N, u ≠ v) 같은 간선은 한 번만 주 www.acmicpc.net >문제 >접근방법 그래프 탐색으로 한 번 탐색이 종료될 때마다 count 개수를 세면 되겠다. >풀이법 주석으로 대체 >코드 1) bfs로 푼 코드 import sys from collections import deque # 시간초과 방지를 위한 코드 (input()으로 입력받으면 시간초과가 뜸) input = sys.stdin.readline # 노드와 간선의 개수를 각각 입력 받기 n, m = ma..

2644번: 촌수계산 사람들은 1, 2, 3, …, n (1 ≤ n ≤ 100)의 연속된 번호로 각각 표시된다. 입력 파일의 첫째 줄에는 전체 사람의 수 n이 주어지고, 둘째 줄에는 촌수를 계산해야 하는 서로 다른 두 사람의 번호가 주어 www.acmicpc.net >문제 >접근방법 친척 관계를 그래프라고 생각하고 방문할 때마다 방문하기 이전 노드의 방문 횟수를 쌓아간다. >풀이법 주석으로 대체 >코드 import sys # 런타임에러(재귀오류) 방지용 코드 sys.setrecursionlimit(10**6) # 전체 사람 수 입력 받기 n = int(input()) # 촌수를 계산 할 두 사람의 번호 입력 받기 a, b = map(int, input().split()) # 부모자식들 간의 관계 개수 ..

10026번: 적록색약 적록색약은 빨간색과 초록색의 차이를 거의 느끼지 못한다. 따라서, 적록색약인 사람이 보는 그림은 아닌 사람이 보는 그림과는 좀 다를 수 있다. 크기가 N×N인 그리드의 각 칸에 R(빨강), G(초록) www.acmicpc.net >문제 >접근방법 dfs로 풀었다. 구역 전체를 탐색하면서 상하좌우를 방문해서 이전 문자와 같으면 다시 상하좌우 탐색 재귀를 반복하는 식으로. 구역 전체 탐색을 총 두 번 하는데 처음 탐색할 때 G인 값은 R로 바꿔준다. 그리고 바꾼 구역을 두 번째로 탐색할 때의 값은 적록색약이 있는 사람의 기준이 된다. >풀이법 주석으로 대체 >코드 import copy import sys # 런타임에러(재귀오류) 방지 sys.setrecursionlimit(10**6)..