게임의 한 스테이지는 신 후보자 면접도 있다
게임을 하나 만들어 본다. SNS 요소가 가미된 사이버 게임이다. 또 이건 문제 해결 게임이다. 일단 매 게임마다 미션이 자동적으로 주어지고 참가자에게는 각각의 역할이 부여된다.
HTML 좌우로 이미지 배치하기, 글상자 만들기
여러 이미지 한 행에 넣기 (브라우저 창의 폭이 줄면 이미지가 줄바뀜) <div class="separator" style="clear: both; text-align: center; "><img.. src="이미지 주소1"/><img.. src="이미지 주소2"/></div> → [1]a의 style 속성 삭제 및 target="_blank" 추가 [2]각 자료(img, iframe)에 style="margin: 2px 0; vertical-align: middle;" 추가 → 설명은 span style의 margin-top을 margin-bottom: 3px; 로 교체 (여럿 중 이미지1만 설명을 달려면 이미지1+설명을 자식 <div style="display: inline-block; vertical-align: middle;"></div> 로 감싼다) * 이미지들의 서로 다른 세로 길이를 하나로 일치시키려면, 대상 이미지의 가로 길이 = (기준 이미지 원본 세로 / 가로) / (대상 이미지 원본 세로 / 가로) * 기준 이미지의 원하는 가로 길이 (소수점 둘째까지) 테이블로 좌우 나누어 자료 넣기 (브라우저 창의 폭이 줄어도 무조건 한 행에 표시됨) <table class="txc-table" style="border-collapse: collapse; margin: 0 auto; text-align: center;"><tbody><tr> <td>가나</td> <td>다라</td> </tr></tbody></table> → [1]가나와 다라에 이미지 삽입 [2]자료 간 여백 <td...
