CSS

[Bootstrap] 부트스트랩 테이블 컬럼명 세로쓰기 방지하기

세미 프로젝트의 프론트단을 부트스트랩으로 구현 하기로 했다. 헤더영역를 html/css/jQuery로 만든 시점에서 다른 조도 부트스트랩을 사용한다고 해서 급하게 찾아봤다. 프론트 쪽에서 라이브러리를 써야할 줄 생각도 못했는데 (일일히 만드는 게 더 오래걸리는 줄도 모르고 ) 부트스트랩을 사용해보니 사용방법이 쉽고 일일히 디자인을 적용할 필요가 없다는 점에서 시간을 아끼고 있다. (사실 예쁘게 할 수 있는 디자인을 보고있자니 이것도 적용 저것도 적용 해보고 욕심이 생기는데, 시간이 턱없이 부족하고 몇몇 기능은 어쩐지 안돌아간다. 모달과 드롭다운 메뉴 같은게 잘 안되서 결국 모달창은 직접 만들게 됨.) 이 부분은 내가 따로 추가해야할 외부 링크를 연결하지 않아서 일 수도 있는데 따로 모달창과 셀렉트 옵션으..

[CSS] CSS Diner 게임

오늘 CSS 수업중에 진행한 게임 CSS select 연습을 할 수 있는 게임 사이트 이다. 은근 재밌었으니 블로그에 남겨둔다 https://flukeout.github.io/ CSS Diner A fun game to help you learn and practice CSS selectors. flukeout.github.io 사이트 내의 게임 화면은 이렇게 나오는데 leval 1 ~ 32 까지 플레이 가능하다. 화면에서 뽀잉뽀잉 하고 움직이는 그릇이나 과일(사과, 피클, 오렌지)을 왼쪽 CSS구문안에 작성해 날려보내는 게임이다. 매 게임의 목차와 오른쪽 화면을 보면 어떤 식으로 작성해야 하는지 힌트가 나온다. 예를 들면 22번 문제에서는 3번째, 5번째 그릇이 움직이는데, Nth-of-type 을 사..