Haruponea

https://www.acmicpc.net/problem/7569 #include using namespace std; #define X first #define Y second int board[102][102][102]; int vis[102][102][102]; int dx[6] = {1, 0, -1, 0, 0, 0}; int dy[6] = {0, 1, 0, -1, 0, 0}; int dz[6] = {0, 0, 0, 0, 1, -1}; int main(void) { ios::sync_with_stdio(0); cin.tie(0); int ans = 1; int m, n, h, z, x, y; cin >> m >> n >> h; queue q; for (int i = 0; i < h; i++) for..

https://www.acmicpc.net/problem/10026 #include using namespace std; #define X first #define Y second string board[102]; int vis[102][102]; int dx[4] = {1, 0, -1, 0}; int dy[4] = {0, 1, 0, -1}; int RGBBFS(int n) { //적록색약인 경우 int ans = 0; for (int i = 0; i < n; i++) { for (int j = 0; j < n; j++) { if (vis[i][j] == 0) { ans++; queue q; q.push({i, j}); vis[i][j] = 1; char curColor = board[i][j]; whi..

==(double equals) | != type을 신경쓰지 않고 value만 비교하여 결과를 도출합니다. 두 값이 다른 type이면 비교하기위해 type이 같아지도록 강제로 변환합니다. 예측불가능한 결과를 도출할 수 있습니다. 1 == 1; //true 1 == '1'; //true 'a' == 'b'; //false 0 == ''; //true 0 == false; //true null == undefined //true 1 != '1'; //false ===(truple equals) | !== type과 value를 고려하여 결과를 도출합니다. 같은 타입으로 변환하는 과정을 거치지 않습니다. 1 === '1'; //false 0 === false; //false 1 !== '1'; //true 값..

width: 100%와 max-width: 100%의 차이점이 존재한다. 컨테이너의 크기보다 큰 요소에 사용할 경우 두 property 모두 컨테이너의 크기만큼 줄여준다. 하지만 컨테이너의 크기보다 작은 경우 width:100%는 컨테이너의 크기에 맞추어 늘려주고 max-width:100%는 원래 컨텐츠의 크기를 유지시킨다.

Flexbox는 열 또는 행으로 아이템을 배치할 수 있는 일차원 layout method입니다. 페이지의 contents 상자 안에 아이템을 배치하는데 사용합니다. flexbox를 사용하면 화면의 크기에 따라 공간을 적절히 분배해줘 편리하게 layout을 구성할 수 있습니다. 여기에서는 flexbox의 property를 정리하겠습니다. 1. display: flex flexbox를 사용하기위해선 먼저 container가 되는 element에 display:flex를 추가해야합니다. 그 flexbox의 안에는 두개의 축이 있습니다. main axis의 기본 방향은 왼쪽에서 오른쪽입니다. 아이템은 주축의 방향으로 배치됩니다. 아래 이미지들에서 아이템의 순서는 html문서 상 빨주노초파남보 순서로 컨테이너 안..

https://www.acmicpc.net/problem/1012 #include using namespace std; #define X first #define Y second int board[52][52]; int vis[52][52]; int dx[4] = {1, 0, -1, 0}; int dy[4] = {0, 1, 0, -1}; int main(void) { ios::sync_with_stdio(0); cin.tie(0); int t; cin >> t; while (t--) { int n, m, k, x, y, ans = 0; cin >> m >> n >> k; for (int i = 0; i < 52; i++) { fill(board[i], board[i] + 52, 0); fill(vis[i..

transform을 통해 요소의 확대, 축소, 늘리기, 기울이기, 회전 등등 다양한 변형을 할 수 있습니다. 여기에서는 몇가지 transform을 정리해보겠습니다. 1. transform:rotate() 요소를 회전시킵니다. 단위로 rad, deg, turn 등등을 사용합니다. transform-origin을 통해서 회전축을 바꿀 수 있습니다. See the Pen Untitled by Haruponea (@Haruponea) on CodePen. 마우스를 올려보면 위에는 중심을 기준으로, 아래 div는 오른쪽 아래 꼭짓점을 기준으로 회전하는 것을 알 수 있습니다. 2. transform:scale() 요소의 크기를 조절합니다. See the Pen Untitled by Haruponea (@Harupo..

1. position: static 문서의 일반적 흐름을 따라 배치됩니다. top, right, bottom, left, z-index properties는 효과가 없습니다. default value가 static입니다. 2. position: relative 문서의 일반적 흐름을 따라 배치되지만, top, right, bottom, left로 현재 위치에서 offset을 줄 수 있습니다. page layout에서 요소에 주어진 공간은 static일때와 같습니다. 3. position: absolute 문서의 일반적 흐름에서 제거되고 page layout에서 요소를 위한 공간이 없어집니다. 가장 가까운 position이 static이 아닌 조상 요소를 기준으로 하거, 그렇지 않다면 initail cont..

1. percentages %는 항상 다른 값에 대한 상댓값입니다. 다른 값은 부모의 값이 될수도, 요소 자신의 값이 될 수 도 있습니다. width: 50% -> 부모의 width의 50% line-height 50% -> 자기 자신의 font-size의 50% 2. em em도 relative unit입니다. font-size에 em을 사용할 때, 1em은 부모 요소와 같은 크기의 font-size, 2em은 부모 요소 font-size의 2배가 됩니다. 다른 property와 사용하면 1em은 요소 자체의 font-size와 같고 2em은 요소 자체의 font-size의 2배입니다. /*html */ article{ font-size:20px; } p{ font-size:2em; margin-lef..

1. universal selector 문서의 전체의 요소를 선택합니다. * { property: value; } 2. element selector 해당되는 요소를 모두 선택합니다. 태그의 이름을 그대로 사용합니다. element_name { property: value; } 3. ID selector 해당되는 ID를 가진 요소를 선택합니다. #ID{ property: value; } 4. class selector 해당되는 class를 가진 요소를 선택합니다. 특정 selector 중 특정 class를 가지고 있는 요소를 선택할때에는 selector.class로 사용합니다. /* class에 해당하는 모든 요소를 선택합니다. */ .class{ property: value; } /* selector ..