힘차게, 열심히 공대생

21단계 - 세로상 여분 공간 간격 조절 align-content : 세로선 상에 여분의 공간이 있는경우 flex 컨테이너 사이의 간격을 조절합니다. flex-start: 여러 줄들을 컨테이너의 꼭대기에 정렬합니다. flex-end: 여러 줄들을 컨테이너의 바닥에 정렬합니다. center: 여러 줄들을 세로선 상의 가운데에 정렬합니다. space-between: 여러 줄들 사이에 동일한 간격을 둡니다. space-around: 여러 줄들 주위에 동일한 간격을 둡니다. stretch: 여러 줄들을 컨테이너에 맞도록 늘립니다. 22단계 23단계 24단계 - flex 요소 정리 justify-content : flex 요소 가로선 상 정리 align-items : flex 요소 세로선 상 정리 flex-dir..

14단계 - 아이템 요소 개개인 순서 지정 order : flex 요소의 순서를 지정 order의 기본 값은 0이며, 양수나 음수로 바꿀 수 있습니다. 15 단계 - order 음수 16단계 align-self : 지정된 "align-items"값을 무시하고 flex요소를 세로선 상에서 정렬합니다. 17단계 18단계 flex-wrap : flex 요소들을 한 줄 또는 여러 줄에 걸쳐 정렬합니다. nowrap: 모든 요소들을 한 줄에 정렬합니다. wrap: 요소들을 여러 줄에 걸쳐 정렬합니다. wrap-reverse: 요소들을 여러 줄에 걸쳐 반대로 정렬합니다. 19단계 flex-direction : 정렬한 방향을 지정합니다. 20단계 flex-flow : flex-direction 과 flex-wrap ..

8단계 - 정렬 방향 지정 flex-direction : 정렬할 방향을 지정합니다. row: 요소들을 텍스트의 방향과 동일하게 정렬합니다. row-reverse: 요소들을 텍스트의 반대 방향으로 정렬합니다. column: 요소들을 위에서 아래로 정렬합니다. column-reverse: 요소들을 아래에서 위로 정렬합니다. 9단계 - 요소를 세로 방향으로 10단계 column-reverse 또는 row-reverse를 사용하면 요소들의 start와 end의 순서도 뒤바뀝니다. 11단계 12단계 13단계

1단계 - 오른쪽 정렬 justify-content : flex요소들을 가로선 상에서 정렬 flex-start: 요소들을 컨테이너의 왼쪽으로 정렬합니다. (default) flex-end: 요소들을 컨테이너의 오른쪽으로 정렬합니다. center: 요소들을 컨테이너의 가운데로 정렬합니다. space-between: 요소들 사이에 동일한 간격을 둡니다. space-around: 요소들 주위에 동일한 간격을 둡니다. 2단계 - 가운데 정렬 3단계 - flex 주위 간격 설정 4단계 - 요소 간격 5단계 - 세로 정렬 align-items : flex 요소를 세로선 상에서 정렬 flex-start: 요소들을 컨테이너의 꼭대기로 정렬합니다. flex-end: 요소들을 컨테이너의 바닥으로 정렬합니다. center:..

소가 길을 건너간 이유 1 성공출처다국어 한국어 시간 제한메모리 제한제출정답맞은 사람정답 비율 2 초 512 MB 2081 1254 1123 60.572% 문제 닭이 길을 건너간 이유는 과학적으로 깊게 연구가 되어 있지만, 의외로 소가 길을 건너간 이유는 거의 연구된 적이 없다. 이 주제에 관심을 가지고 있었던 농부 존은 한 대학으로부터 소가 길을 건너는 이유에 대한 연구 제의를 받게 되었다. 존이 할 일은 소가 길을 건너는 것을 관찰하는 것이다. 존은 소의 위치를 N번 관찰하는데, 각 관찰은 소의 번호와 소의 위치 하나씩으로 이루어져 있다. 존은 소를 10마리 가지고 있으므로 소의 번호는 1 이상 10 이하의 정수고, 소의 위치는 길의 왼쪽과 오른쪽을 의미하는 0과 1 중 하나다. 이 관찰 기록을 가지..

CSS display는 이름 그대로 어떻게 보이느냐이다. css 요소가 사용자에게 어떻게 보여질지 설정할 수 있다. inline / block none flex 1. inline to block / block to inline (디스플레이) display를 이용하여 인라인 요소를 블락으로, 그 반대로도 제어할 수 있다. ex) .div{ display : inline; } .span{ display : block; } 2. none None은 말 그대로 요소를 보이지 않게 하는 것이다. 보이지만 않을 뿐 위치는 차지한다. diplay : none; 3. Flex flex는 각 요소들을 비율로 위치를 나누는 기법입니다. flex를 사용하기 위해서는 먼저 부모 클래스의 display를 flex로 설정해 줍니..

1. Padding과 Margin 각 아이템 요소들의 크기를 결정해주는 옵션은 패딩과, 마진 2가지가 있다. 패딩과 마진의 차이점은 Padding : 내 덩치를 키운다. (아이템요소 내부 크기) Margin : 다른 사람과의 거리를 둔다. (아이템 외부 크기) 라고 나는 외운다. Padding, Margin 크기 정해주기(순서) 패딩과 마진 둘다 크기를 정해줄 때 4면 (위 아래, 왼쪽, 오른쪽)을 각각 다르게 줄 수 있다. 작성 방법 item { padding : 1px 5px 8px 12px; /*위,오른쪽, 아래, 왼쪽*/ } 2. 포지션 (Position) css 포지션은 크게 3가지 (relative, absolute, fixed)가 있다. 3가지 포지션의 차이점은 1. relative (반응형..

HTML 1. Inline/Block 태그 차이점 1) 블럭 태그 (div) 블럭태그는 한줄 전체를 사용(블럭단위) 2) 인라인 태그 (span) 인라인 태그는 요소의 부분만 사용 ( 옆에 공간이 있으면 이어서 위치) div1 div1 div1 span1 span2 span3 2. 목록, 리스트 태그 ul 태그 ul태그는 순서가 없는 리스트 태그입니다. 요소에 속하는 각 아이템은 요소를 사용하여 나타내며, 이때 아이템 앞에 추가되는 마커(marker)는 검정색의 작은 원(bullet)이나 사각형 모양으로 표현됩니다. 아메리카노 카페라떼 핫초코 차 녹차 홍차 자스민차 ul 태그 점 없애기 리스트로 구역을 나누고 싶지만, 리스트가 아닌척 하고 싶을 때, 저 점을 없애면 됩니다. css - list 스타일 바..

단일 테이블 이름 변경 (RENAME) RENAME TABLE old_table TO new_table; ex) rename table 24shop to AllTimeShop; 단일 테이블 이름 변경 (ALTER) ALTER TABLE old_table RENAME new_table; RENAME 과 ALTER RENAME의 차이 RENAME을 사용하면 다수의 테이블이름 변경이 가능하다. 다수 테이블 이름 변경 RENAME TABLE old_table1 TO new_table1, old_table2 TO new_table2, old_table3 TO new_table3;

오리 성공 시간 제한메모리 제한제출정답맞은 사람정답 비율 2 초 512 MB 642 226 188 35.878% 문제 오리의 울음 소리는 "quack"이다. 올바른 오리의 울음 소리는 울음 소리를 한 번 또는 그 이상 연속해서 내는 것이다. 예를 들어, "quack", "quackquackquackquack", "quackquack"는 올바른 오리의 울음 소리이다. 영선이의 방에는 오리가 있는데, 문제를 너무 열심히 풀다가 몇 마리의 오리가 있는지 까먹었다. 갑자기 영선이의 방에 있는 오리가 울기 시작했고, 이 울음소리는 섞이기 시작했다. 영선이는 일단 울음소리를 녹음했고, 나중에 들어보면서 총 몇 마리의 오리가 있는지 구해보려고 한다. 녹음한 소리는 문자열로 나타낼 수 있는데, 한 문자는 한 오리가 낸..