본문 바로가기

하드코딩2

html의 기본 표(table) 코드 공유 지난번에 Table Generator를 소개한 적이 있다. 간단한 클릭 몇 번만으로 원하는 모양의 예쁜 테이블 코드를 자동으로 생성해 주는 사이트이다. http://www.tablesgenerator.com/ 그런데 막상 다양하고 예쁜 모양의 표를 만들어 쓰려니, 매번 포스팅할 때마다 코드를 가져오기가 너무 번거로웠다. 여러 가지 테이블을 미리 구비해 놓으면 좋겠지만, 너무 개수가 많아지면 나중에 너무 골치아파질 것 같다. 그래서 아주 단순한 모양의 표를 짜서 코드를 공유한다. 1px의 회색 테두리가 있고 셀 배경이 흰색인, 그냥 기본 표 코드이다. CSS에는 다음 코드를 추가해 준다. 혹시 제목줄을 쓸까 싶어서 th(첫째 줄) 속성에는 배경색과 별도의 테두리를 설정해 두었다. 개별 속성은 임의로 수정해.. 열린노트/IT·SW·디자인
다양한 형식의 예쁜 표(테이블)를 자동으로 만들어주는 사이트 CSS에 익숙해지면 페이지를 코딩하거나 블로그 게시물을 쓸 때 별로 막히지 않는데, 유독 테이블만 작성하려고 하면 굉장히 골치 아프다. 틀을 좀 정해 놓고 싶어도 하드 코딩만으로는 적당하고 예쁜 테이블 속성을 완성하는 데 시간이 많이 걸리고 디자인 감각도 여간 필요한 게 아니다. 그래서 찾은 곳이 바로 Table Genetrator. 간단하게 예쁜 html(CSS) 테이블(table) 만들기 먼저 아래 사이트에 접속한다. http://www.tablesgenerator.com/ 가면 이렇게 쭉 종류별 테이블들이 구분돼 있다. LaTeX, HTML, Text, Markdown 등등... 원하는 형식을 찾아가자. 대부분은 HTML이 필요할 것 같고, Text Table도 경우에 따라 아주 쓸모가 많을 것 같.. 열린노트/IT·SW·디자인