css 썸네일형 리스트형 하드코딩 중...^^; 하드코딩으로 빼곡히 채운 CSS 파일을 보면... 괜히 뿌듯해지는 느낌 ^^; 하지만, 이제 이런 업무도 언제까지 할 수 있을지 모르겠다... 2017.2.8. [CSS] 에릭 마이어의 CSS 리셋, CSS 기본선언, CSS 초기화 에릭 마이어의 CSS 리셋, CSS 기본선언 보통 사이트 CSS 파일을 처음 작업시 여러가지 셋팅값을 초기화(?)해야 합니다. 기본값들을 초기화 하는 것이죠. * {margin:0;padding:0;} 이렇게만 해도 많은 속성들이 초기화가 될 것입니다. 하지만, 브라우저에 쓸데없는 일을 시키는 것일 수도 있습니다. 그래서 CSS 고수(?) 에릭 마이어의 기본선언법을 참고하려 합니다. 이것도 정답이다~! 라는 것은 아니고 유용하니 사람들이 많이 사용하는 것이겠지요. 저 또한 그러한 사람들 중에 하나지요. 아마 제 블로그는 드래그가 안 될테니 파일을 첨부하도록 하겠습니다.^^ 텍스트 CSS3로 구현한 여러 애니메이션 효과를 간단하게 구현할 수 있는 Magic Animations CSS3 CSS3로 구현한 여러 애니메이션 효과를 간단하게 구현할 수 있는 Magic Animations CSS3 간결하면서도 다이나믹한 효과들이 여러가지 있네요. 이번에 사용해봐야겠습니다.ㅋ 2015.3.11. CSS와 jQuery로 구현한 3D 박스효과 Turnbox.js CSS와 jQuery로 구현한 3D 박스효과 Turnbox.js 언제가 기회가 되면 한번 사이트에 적용해보고 싶네요 ^^; 2015.3.10. CSS3 와 jQuery를 활용한 3D Curtain Template, 커튼효과 사이트 템플릿 3D Curtain Template, 커튼효과 사이트 템플릿 데모를 보시면 좀 다이나믹한 사이트를 제작할 수 있다는 기대감이 들게 되는 템플릿입니다. 소스를 수정해서 응용한다면 꽤 멋진 사이트가 될 것 같네요. 2015.2.2. CSS3를 활용한 롤오버(호버) 효과 라이브러리, HOVER.CSS CSS3를 활용한 롤오버(호버) 효과 라이브러리 - hover.css 일단 위 링크를 보시면 얼마나 유용한 소스인지 아실 겁니다. ^^ 2015.1.29. CSS3 버튼 만들어주는 사이트 (한국어버전), CSSGENERATORS CSS3 버튼 만들어주는 사이트(한국어버전) 사이트에서 CSS3 로 여러가지 효과를 자동으로 스크립트 해주는 사이트는 많습니다. 다만, 한국어 지원은 보기가 힘들었지요. 그런데, 이렇게 한국어로 설명해주는 사이트가 있네요. 스크랩해봅니다. ㅎ 아래 링크를 클릭해서 이동하세욥~! 2014.12.29. [CSS] 텍스트에 특정배경이미지를 마스킹하는 CSS 배경 클립 텍스트 배경 및 그라디언트 h1 { background:url(image_url_here); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } 더 자세한 내용은 아래 링크를 클릭하셔서 보세요. 이 CSS 문법의 가장 큰 단점이 하나 있습니다. 바로 웹킷브라우저에서만 작동가능하다는 것~! 아직까지는 익스때문에는 활용되기 어렵겠네요. 하지만, 모바일 전용 사이트라면 충분히 멋진 기법일 것 같습니다. 2014.11.27. [CSS] input submit 버튼의 텍스트에 font awesome 아이콘 사용하기 겁나 유용한 Font Awesome을 사용하다 input submit 타입에서 막혔다 열심히 사이트 작업을 하던 중 이번 포스팅의 제목처럼 input submit 타입에서 막혔다. 말인 즉, input 타입중 submit 타입은 value 로 버튼 안의 텍스트를 제어 하는데... 이 안에 태그를 사용하지 못하기 때문에 곤란해졌었다. 맨처음에는 스트립트로 제어를 하려 했는나...안되기는 마찬가지... 분명히 나와 같은 문제를 겪었던 사람이 있을텐데... 네이버 검색에서는 일단 font Awesome 에 대한 자세한 내용은 없었다. 온통 그냥 font awesome 어떻게 사용하는 지에 대한 포스팅만 많을 뿐...문제점에 대한 포스팅은 없었다. 그래서 구글링으로 넘어갔다...단박에 찾음...구글링의 위대함을.. [CSS] 엑시스제이에서 만든 한국형 폰트어썸 Font Awesom, Axicon.axisj.com AXIcon Basket 외국의 Font Awesome 사이트와 비슷하네요. ㅎ 엑시스제이에서 만든 폰트아이콘으로 무료로 제공한다합니다. 2014.11.5. [CSS] 아이콘(Icon)을 이미지가 아닌 폰트(Font)로 사용하기, Font Awesome The Iconic font and CSS toolkit 예전에는 아이콘이라하면 이미지였는데, 이제는 아이콘이 폰트로 인식하여, 컬러, 자간, 사이즈를 조정이 가능하게 되었네요. 신기하네 ㅋ 사용방법이나 아이콘의 종류는 해당 사이트에 들어가서 확인하고 사용하면 됩니다. 다운로드도 되지만, CDN 방식으로도 사용이 가능해 아주 유용하네요. 2014.11.4. [CSS] 종이가 약간 들린 느낌을 css로만 구현하기 [CSS] 종이가 약간 들린 느낌을 css로만 구현하기 [CSS] 예쁜 그라데이션 CSS Code를 모아놓은 uiGradients uiGradients [CSS] 가로, 세로 중앙정렬 CSS 완벽가이드 Centering in CSS: A Complete Guide 부트스트랩 Bootstrap 혼자 공부하기 좋은 사이트, 그냥 한번 정독해보세요. 읽고 또 읽고, 보고 또 보고 해야 할 것 같아요 ㅎ 언제부터인가 사이트를 개발하는 과정에서 어깨넘어로 부트스트랩를 활용해라. 부트스트랩을 공부하라. 부트스트랩을 사용하면 작업속도가 빠르다. 라는 말들을 듣곤 했습니다. 그래서 그 당시 잠깐 검색을 해보니 하나의 사이트 템플릿이라는 사람들도 있고, 제이쿼리 묶음이라는 사람들도 있고, 그렇더라구요. 모두다 틀린 말은 아닙니다. 그리고, 필요성을 잘 느끼지 못하다가 약간 여유가 생겨 이번 기회에 부트스트랩이 뭔가 한번 공부해보기로 했습니다. 책을 살까? 학원을 다닐까? 생각해보았지만 먼저 인터넷에서 정보를 모아보자 해서 찾은 사이트~! 영어로 된 원문사이트도 있고, 한글로 번역된 사이트도 있었습니다. http://bootstrapk.com/BS3/ 약간은 아.. HTML5, CSS3, Javascript 에 대한 강의자료 출퇴근 시간에 한번 읽어봐야겠습니다 CholYeon Won 교수님께서 공개하신 HTML5, CSS3 and Java Script 책 입니다. HTML5 등장 배경 및 표준화 현황 1. HTM5의 구조 및 기본 지식 익히기 1.2 웹 브라우저(Browser)의 기능과 한계 1.3 HTM5의 구조(Structure) 1.3.1 HTML5의 요소(Element) 작성 방법 1.3.2 HTML5에서 요소(Element)의 속성(Attribute) 작성 방법 1.4 환경설정 및 기본 편집기 2. metadata Elements 2.2 meta 요소(Elements) 3. Section Elements, 3.1 nav, header 요소(Element)를 이용한 구성 3.2 section, header, nav 요.. 이전 1 2 3 4 다음
