반응형

Web 33

Cross-Browser CSS Gradient

CSS Gradient은 webkit에 의해 도입되었으나 많은 브라우져에서 호환이 되지 않는 문제로 인해 사용되어지지 않았습니다. 하지만 지금은 많은 브라우져에서 그라데이션을 지원하여 CSS 만으로도 배경에 그라데이션 효과를 줄수 있습니다. 그러나 모든 브라우져에서 CSS Gradient를 사용할 수 있는 것은 아니니 유의하시기 바랍니다. 지원 브라우져 현황 Firefox >= 3.6 MSIE > 5.5(!) Safari >= 4 Chrome Webkit Browsers 사파리와 크롬과 같은 웹킷 브라우져는 아래와 같은 규칙을 따릅니다. Firefox 3.6+ Internet Explorer Cross Browser CSS Gradient를 위해서는 위 세가지 코드를 모두 사용하여 CSS를 정의합니다. ..

Web/CSS 2011.07.08

Vector 기반의 Badges 만들기

이 글의 내용은 tutorial9.net의 내용을 기반으로 제작하였습니다. Adobe Photoshop의 Shape을 기반으로한 Vector형 Badges를 제작하는 튜토리얼입니다. STEP 1 우선, 포토샵에서 500px * 500px 사이즈의 새로운 도큐멘트를 생성합니다. 생성 후 Shape의 Ellipse Tool을 이용하여 shift를 누른 상태에서 정원을 그립니다. 색상은 highlight와 shadow가 모두 잘 표현될 수 있는 채도의 색상을 선택하세요. STEP 2다음 단계는 레이어의 스타일을 이용하여 effect를 추가하는 단계입니다. 레이어를 더블클릭하여 Layer Style을 열거나 Menu > Layer > Layer Style > Blending Options 로 이용하여 Layer..

Web/Design 2011.06.16

웹디자인에 수학적 요소를 도입하는 방법 (Applying Mathematics To Web Design)

2010년 2월 9일 SMASHING MAGAZINE에 실린 Applying Mathematics To Web Design에 관한 자료를 FIREJUNE님께서 번역해두신 자료가 있어 발췌해 왔습니다. 황금 비율, 피보나치 수열, 오원소, 사인 웨이브 등 수학적 요소를 웹디자인에 도입하는 방법에 대하여 다루고 있습니다. "수학은 아름답습니다." 수학을 싫어하는 사람은 이 말이 미친소리로 들릴지도 모르겠습니다만 자연과 우주 그리고 작은 조개에서 부터 은하에 이르기까지 모든 만물이 수학적인 요소를 가지고 있다는 것은 사실입니다. 수학은 먼 옛날부터 오늘날까지 예술과 건축 디자인등 여러분야게 걸쳐 이롭게 사용되어 왔습니다. 그리고 수학은 분명히 창의적인 디자인을 생산하는데 밑거름이 될 수 있습니다. 하지만 웹 ..

Web/Design 2011.06.15
728x90