WEB/HTML5 2013. 9. 25.
부트스트랩을 이용한 반응형웹 만들기 HTML5 기본 템플릿
티스토리 스킨을 사용한지 오래되서 이번에 부트스트랩을 이용해서 스킨을 만드려고 합니다. 이번에 부트스트랩도 3.0으로 판올림을 했으니 겸사겸사 부트스트랩 3.0을 이용해서 HTML5 반응형웹으로 만들까 합니다. 티스토리의 경우는 사실 별도의 모바일스킨이 있어서 반응형웹이 크게 필요는 없는데, 이번에 티스토리에서 모바일스킨을 On/Off할 수 있는 기능이 추가되어서 원한다면 반응형웹으로 모바일 디자인을 할 수 있습니다. 추후에라도 여러가지 다양한 형태로 만들기 위한 기본 템플릿을 제작하여 포스팅 했습니다. 위의 화면은 웹브라우저로 볼때 나오는 디자인입니다. 기본 레이아웃 수준이라 특별히 디자인이 적용되어 있지않아 밍밍 하죠? 이제 이쁘게 채워넣고 꾸며야 겠죠. 화면 가로사이즈가 작아지면 자동으로 테블릿이나..
WEB/CSS3 2013. 8. 23.
<UL><LI>를 이용한 가로정렬 메뉴 만들기
이번에는 UL과 LI 태그를 이용해서 간단하게 가로나열 메뉴를 만드는 포스팅을 하겠습니다. 예전에는 테이블을 이용해서 만들거나 그냥 드림위버가 만들어주는 방식으로 만들었었는데요.. 이제는 HTML5를 이용해서 날코딩으로 간단하게 코딩하는 법을 알려드립니다. 이것은 기본의 형태이고 CSS를 이용해서 좀더 꾸며야 겠죠? HTML 부분입니다. MENU1 MENU2 MENU3 MENU4 MENU5 CSS 부분입니다.CSS적용은 여러가지 방법이 있지만 여기서는 태그 사이에 넣으시면 됩니다. /* 기본 설정*/ a{text-decoration:none; color:#000000;} a:hover{color:#ff0000;} /* nav tag */ nav ul{padding-top:10px;} /* 상단 여백 10..
