더 좋은 방식이 있을수도 있겠지만 잘 생각이 안나서 그냥 2차원 리스트에 직사각형을 그려봄.. 더 좋은 방식이 있을 것 같기도 함
x11, y11, x12, y12 = map(int, input().split())
x21, y21, x22, y22 = map(int, input().split())
x31, y31, x32, y32 = map(int, input().split())
x41, y41, x42, y42 = map(int, input().split())
x_list = [x11, x12, x21, x22, x31, x32, x41, x42]
y_list = [y11, y12, y21, y22, y31, y32, y41, y42]
N, M = max(x_list), max(y_list)
graph = [[0]*(M+1) for _ in range(N+1)]
area = 0
for i in range(x11, x12):
for j in range(y11, y12):
if graph[i][j] == 0:
graph[i][j] = 1
area += 1
for i in range(x21, x22):
for j in range(y21, y22):
if graph[i][j] == 0:
graph[i][j] = 1
area += 1
for i in range(x31, x32):
for j in range(y31, y32):
if graph[i][j] == 0:
graph[i][j] = 1
area += 1
for i in range(x41, x42):
for j in range(y41, y42):
if graph[i][j] == 0:
graph[i][j] = 1
area += 1
print(area)
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>서브 이미지 리스트</title>
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/서브 리스트 제작.css">
</head>
<body>
<div class="wrap">
<h1>TOP100</h1>
<div class="main_wrap">
<div class="content">
<p class="noti_txt">8.21 오전 9시 ~ 오전 10시 기준 (재생수, 재생시간, 좋아요)</p>
<ol class="main_list">
<li>
<a href="#" class="item_link">
<div class="img_box"> <!--이미지 외곽선 줄 태그-->
<img src="images/thumb_image_large.jpg" alt="">
</div>
<div class="info"> <!-- css 완성 후 나중에 -->
<span class="category">산악스키</span>
<p class="title">오스트리아 최대의 산악스키 연맹, 산악스키 아마데! 5개 지역에 걸쳐있고, 총 25여개의 슬로프 길이</p>
</div>
</a>
</li>
<li>
<a href="#" class="item_link">
<div class="img_box"> <!--이미지 외곽선 줄 태그-->
<img src="images/thumb_image_large.jpg" alt="">
</div>
<div class="info">
<span class="category">산악스키</span>
<p class="title">오스트리아 최대의 산악스키 연맹, 산악스키 아마데! 5개 지역에 걸쳐있고, 총 25여개의 슬로프 길이</p>
</div>
</a>
</li>
<li>
<a href="#" class="item_link">
<div class="img_box"> <!--이미지 외곽선 줄 태그-->
<img src="images/thumb_image_large.jpg" alt="">
</div>
<div class="info">
<span class="category">산악스키</span>
<p class="title">오스트리아 최대의 산악스키 연맹, 산악스키 아마데! 5개 지역에 걸쳐있고, 총 25여개의 슬로프 길이</p>
</div>
</a>
</li>
</ol>
</div>
</div>
<div class="sub_wrap">
<ol class="sub_list">
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
<li>
<a href="#" class="item_link">
<img src="./images/thumb_image.jpg" alt="">
</a>
<div class="info"> <!-- css 완성 후 나중에 -->
<a href="#" class="title">국제육상경기연맹으로부터 라벨을 부여받은 단 두 개의 마라톤 대회 중 실버라벨을 5년 연속 유지하고 있는 대구국제마라톤대회!</a>
<a href="#" class="category_link">마라톤</a>
</div>
</li>
</ol>
</div>
</div>
</body>
</html>
@charset "UTF-8"; /* 유니코드 문자열(비 아스키코드)이 있을 때 utf-8로 명시적으로 선언해주어 utf-8 인코딩 셋을 지정 */
/* 기본 스타일 선언 */
body {
font-family: Dotum,'돋움', Helvetica, sans-serif;
font-size: 15px;
line-height: 18px;
color: #3c3c3c;
}
a {
color: inherit;
text-decoration: none;
vertical-align: top;
}
img {
vertical-align: top;
}
/* 스타일 선언 */
h1 {
width: 1000px; /* 컨텐츠가 가지는 넓이와 동일하게 */
margin: 0 auto;
padding: 20px 0;
font-size: 26px;
line-height: 38px;
color: #000;
}
.main_wrap {
background-color: #ececec;
}
.main_wrap .content {
position: relative; /* 이걸 선언 안해주면 밑에 .noti_txt 부분이 회색 배경 바깥으로 벗어남 */
width: 1000px;
margin: 0 auto;
padding: 50px 0 20px;
}
.main_wrap .noti_txt {
position: absolute;
top: 20px;
right: 0;
font-size: 12px;
color: #7c7c7c;
}
.main_list li {
float: left; /* 세로로 붙어있던 이미지들이 가로로 붙음 */
/* 여기까지만 하면 회색 배경이 이미지를 감싸지 못함*/
}
.main_list::after { /* float 해제 하는 부분 */
display: block;
content: '';
clear: both;
}
.main_list li + li { /* 이미지 사이 간격 */
margin-left: 17px;
}
.main_list .img_box img {
width: 322px;
height: 215px;
}
.main_list .item_link { /* 앵커는 인라인 요소이기 때문에 이 설정을 선언하지 않으면 영역을 제대로 인식하지 못하는 상황이 발생하기도 함*/
display: block; /* 앵커는 블록인 자식요소를 가지고 있다면 항상 이 부분을 선언해주어야 함 */
}
/* 액자 만들기 */
.main_list .img_box {
position: relative;
}
.main_list .img_box:after {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
content: '';
background-color: rgba(0, 0, 0, 0.2);
border: 1px solid rgba(0, 0, 0, 0.05);
}
/* info 이후 */
.main_list .info {
position: absolute;
right: 15px;
bottom: 15px;
left: 15px;
color: #fff;
overflow: hidden;
}
.main_list .item_link {
position: relative;
}
.main_list .category {
font-size: 14px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 18px; /* font-size 보다 2-4px 정도 더 크게 */
}
.main_list .title {
font-size: 18px;
line-height: 22px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 3px;
}
/* 여기서부터 서브 리스트 관련 */
.sub_wrap {
margin-top: 30px; /* 메인 리스트와 간격을 주기 위함 */
}
.sub_list {
width: 1000px;
margin: 0 auto; /* 가운데 정렬 */
}
.sub_list .item_link img {
width: 188px;
height: 141px
}
.sub_list li {
float: left;
width: 188px; /* 이미지 크기와 동일하게 */
margin-bottom: 40px; /* 첫 번째 줄과 두 번째 줄 사이 간격 */
}
.sub_list::after { /* float 해제하는 부분 */
display: block;
content: '';
clear: both;
}
.sub_list li + li {
margin-left: 15px;
}
.sub_list li:nth-child(5n+1) { /* 1, 6번째 li에만 적용됨 */
margin-left: 0;
}
/* 액자 만들기 */
.sub_list .item_link {
display: block;
position: relative;
}
.sub_list .item_link:after {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
content: '';
border: 1px solid rgba(0, 0, 0, 0.03);
}
/* info 이후 */
.sub_list .info {
height: 79px;
margin-top: 10px;
padding: 5px;
}
.sub_list .title {
display: -webkit-box;
max-height: 36px; /* line-height * -webkit-line-clamp*/
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
font-size: 15px;
line-height: 18px;
color: #090909;
}
.sub_list .category_link {
display: block;
padding-top: 3px;
font-size: 12px;
line-height: 15px;
color: #7ba7df;
/* 길어졌을 때 한 줄 말줄임 될 수 있도록 */
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
요약 정리
이미지 정렬: float, clear(부모가 자식요소의 높이를 인식할 수 있도록), :nth-child(an + b)
이미지 액자: :after, position, border, rgba
텍스트 말줄임: text-overflow, overflow, white-space (여기까지가 한줄 말줄임), -webkit-box, -webkit-box-orient, -webkit-line-clamp, height (여러 줄 말줄임)
N = int(input())
lifeguards = [0]*1000
work = [] # 근무 시간 저장할 리스트
for _ in range(N):
start, end = map(int, input().split())
work.append((start, end))
for i in range(start, end):
lifeguards[i] += 1
ans = 0
for w in work:
start, end = w[0], w[1]
for i in range(start, end): # 현재 근무 시간을 빼기
lifeguards[i] -= 1
time = 0
for lifeguard in lifeguards: # 커버 가능한 최대 시간 계산
if lifeguard > 0:
time += 1
ans = max(time, ans) # ans 갱신
for i in range(start, end): # 다시 현재 근무 시간 더해주기
lifeguards[i] += 1
print(ans)
처음엔 이동한 후 위치에서 +1, -2, +4, -8, ... 이런 식으로 이동하는 건줄 알았는데, 알고 보니 처음 John의 위치인 x에서 +1, -2, +4, -8, ... 인 위치로 이동하는 거였음
x, y = map(int, input().split())
cur_John = x # John의 현재 위치
travel_distance, travel_direction = 1, 1 # 이동 거리, 이동 방향
idx = 1
ans = 0
while True:
for _ in range(travel_distance):
cur_John += travel_direction
ans += 1
if cur_John == y:
print(ans)
exit()
idx *= 2 # 이동할 위치는 x로부터 2배씩 멀어짐
travel_distance = abs(cur_John-x) + idx
travel_direction *= (-1)
M, N, K = map(int, input().split())
signal = []
for m in range(M):
tmp = input()
signal.append(tmp)
for s in signal:
for k in range(K):
for c in s:
print(c*K, end='')
print('')
a, b, x, y = map(int, input().split())
a, b = min(a, b), max(a, b)
x, y = min(x, y), max(x, y)
distance = b-a
teleporter = abs(x-a)+abs(y-b)
ans = min(distance, teleporter)
print(ans)
A, B, N = map(int, input().split())
ans = 1001
for i in range(N):
cost, num = map(int, input().split())
ListOfCities = list(map(int, input().split()))
Departures = False
for city in ListOfCities:
if A == city: # 출발지에 도착한 경우
Departures = True
elif B == city: # 도착지에 도착한 경우
if not Departures: # 출발지를 아직 거쳐오지 않은 경우
break
else: # 출발지를 거쳐온 경우
if cost < ans:
ans = cost
if ans != 1001:
print(ans)
else:
print(-1)
a, b = map(int, input().split())
c, d = map(int, input().split())
John = b-a
if d < a or b < c: # 겹치는 부분이 없는 경우
Bessie = d-c
elif a<=c and d<=b: # 전부 다 겹치는 경우
Bessie = 0
elif c < a and a <= d <= b: # 소가 칠한 부분의 왼쪽이 겹치지 않는 경우
Bessie = a-c
elif a <= c <= b and b < d: # 소가 칠한 부분의 오른쪽이 겹치지 않는 경우
Bessie = d-b
else: # 소가 칠한 부분의 양쪽이 겹치지 않는 경우
Bessie = (a-c) + (d-b)
ans = John + Bessie
print(ans)
코드-2
다시 보니까 더 간단하게 풀 수 있을 것 같아서 풀어봄
a, b = map(int, input().split())
c, d = map(int, input().split())
if d < a or b < c: # 겹치는 부분이 없는 경우
ans = b-a + d-c
else: # 겹치는 부분이 있는 경우
min_f, max_f = min(a, b, c, d), max(a, b, c, d)
ans = max_f-min_f
print(ans)
