디자이너는 또한 프런트 엔드 지식을 이해할 필요가

중국어 회화 "그릴을 먼저 뼈를 그리는 호랑이"는 말이 있다. 웹 페이지에 해당 http://www.aliyun.com/zixun/aggregation/8936.html "> 시각 효과 그냥 피부, 프런트 엔드 코드 지원이 피부 뼈, 골격은 긴 어떻게 이해, 더 합리적이 고 효율적인 페이지를 디자인 하는 데 도움이 하는 것입니다."

를 달성 하는 방법

CSS의 효과 관련 된 텍스트 속성은 해당 스타일, 글꼴 크기, 줄 높이, 굵게, 기울기, 밑줄, 등, 하지만 몇 가지 특수 효과 CSS의 효과에서 PS 레이어 스타일에 주로 힘. 하지만 CSS는 또한 진화 하 고, 텍스트 그림자, 불행 하 게도 i e 6의 효과에 추가 되었습니다는 c s s 3에 7, 8은 지원 되지 않습니다. 따라서, 좀 더 특별 한 텍스트 효과, 여전히만 얻을 수 있습니다 그림을 통해.

는

CSS에서 실제로 텍스트의 간격을 제어할 수 있습니다 하지만 현실은 거의 사용, 한편으로, 많은 디자이너 CSS 해당 특성 그리고 장면의 텍스트 간격을 사용 하 여 별로, 다른 한편으로, 텍스트 간격 일부 시나리오에서는이 특성을 만드는 방법의 브라우저 해상도 사용할 수 없습니다, 예를 들어 텍스트를 중간에 영역의 실제 센터에에서 포함 텍스트 간격 (와 같은 위에), 사람들의 시각 효과 허용 하지 수 있도록 어디 텍스트 (예: 두 단어 버튼)에 특정 공간을 유지 하는 필요 직접 대체 됩니다 공간.

하지만 그것은 항상 좋은 순간, 몇 가지 시나리오는 하지만 그것은 편리 하 게 하루에 올 수 있지만 텍스트 간격을 달성 하는 방법을 알고. 예를 들어 12 검정 텍스트 매우 조밀한, 보이는 것입니다 하지만 텍스트 간격의 비트, 독서 효과 훨씬 더 될 것입니다.

웹 페이지는 일반적으로 글꼴의 노래, 하지만 사실, 글꼴 다른 글꼴의 사용은 서버 및 다음 페이지에 업로드할 수 있습니다 권장 하지 않습니다에서에서 중국어 텍스트 글꼴을 말합니다, 그것 해결 사용자의 컴퓨터에는 해당 글꼴 문제. 하지만 아주 소수의 사람 할 것 이다. 1. 브라우저의 웹 페이지의 사용자 설정 글꼴 대신 글꼴을 무시 하도록 설정할 수 있습니다 (IE: 도구-> 인터넷 옵션-> 내게 필요한 옵션). 2. 서버에 글꼴 로드, 하 고 글꼴은 일반적으로 몇 메가바이트, 심각 하 게 페이지 로드 속도 영향을 미치는. 그래서 특별 한 글꼴, 그것은 일반적으로 만든 사진으로.

어떻게 버튼은 일반적으로 밖으로 철자를 참조 하십시오.

우리는 디자인 처럼 일반적으로 제품 클래스의 버튼 (중간 섹션은 수평 반복 패턴), 안 좋아 B 제품 클래스 버튼 때문에 일반적으로 재사용, 두 단락을 사용 하 여 단추, 밖으로 철자와 b이이 폭 죽음에 제한 됩니다.

c s s 3에서 마침내 그라데이션, 둥근 모서리 실현 및 계획, 하지만 불행히도 IE6, 7, 8는 지원 되지 않습니다, 하지만 이미 새로운 CSS, 특히 버튼, 희미 한 그라데이션의 응용 프로그램을 볼 점점 더 많은 웹 사이트에서 볼 수 있습니다, 희미 한 그림자, 효과의 비트를 가져가 지원 되지 않는 브라우저에 대 한 매우 좋은 색상 근사 배경 설정 흑백, 직사각형 효과 참조 하십시오.

참고 코드는 다른 색으로 균일 한 색 그라데이션에서 선형 그라데이션 수만 수 높은 빛 또는 뭔가 삭제 될 수 있습니다. 또한 방사형 그라디언트는 c s s 3에 있지만 몇 가지 임시 응용이 있다.

인터넷의 발전은 매우 빠르게, 크고 작은 새로운 기술, 많은 프런트 엔드 통신 바.

스냅에 대 한

중간 센터의 아래쪽에 텍스트의 형태로 주로 맞춤, ps에서는 매우 간단 합니다, 하지만 실현은 위와 같이, 어렵다 보고, 정렬, 하 고 싶은 귀찮은 건 정말, 좋은 방법은 없습니다. 그래서가 특히 중요 한 곳이 아니다.

의 첫 번째 단계를 하는 방법

페이지 로딩 속도를, 하려면 그림에 하나 이상의 이미지를 넣어야 합니다.

에 저장 하

웹 페이지, 사진, 사진 배너 클래스는 일반적으로 저장, JPG로 일반적으로 저장 png 또는 GIF로 (를 제외 하 고 애니메이션된 이미지는 GIF를 사용 해야, 다른 장면 png 8 GIF를 완전히 대체할 수 있다). Png 또는 GIF로 저장 되는 사진에 대 한 때 (아래 이미지의 오른쪽)에 리본 센 세이 션을 보여주는 그림을 참조 하 고 왜곡은 심각한 있다.

두 가지, 하나 색상의 수를 증가 하는 것입니다 하지만 수에 있는 증가 더 큰 그림에서 결과 것입니다, 그림의 크기와 색상의 수 사이 균형을 취할 필요가 경우 그림의 색은 너무 많은 경우에 최대 256, 거기 것입니다 여전히 색상의 수는 분명 밴드 느낌 지도에 비슷한 색상의 그림을 넣어.

는

외부 패치 (마진)를 통해 절대 위치 (위치: 절대) 디자인 레이아웃에 의해 제한 되지 않는다 그래야, 중첩의 효과의 여러 요소를 얻을 수 있습니다.

몇 가지 특별 한 장면 (는 "뒤로 가기" 위에) 등 다음과 같은 문제를 해결 하기 위해 사용 됩니다.

프런트 엔드 지식 이해, 뿐만 아니라와 같은 컨트롤의 디자인에 PS 보기 호버 스타일은 항상 하지 직관, 느낌, 디자인 초안에 만족 때까지 조정 하는 직관적인 컨트롤을 실현할 수 있습니다 다음 부드럽고, 더 합리적인 디자인, 디자인 프로세스에 대 한 커뮤니케이션에 도움, 또한 있다. 비용이 비교적 큰 이지만, 그것은 여전히 신중 하 게 조사 해야 하는 컨트롤에 대 한 가치가입니다.

누군가 한 번 말했다 좋은 기술 디자인에 있는 돌파구에 대 한 가져올 수 있다 좋은 디자인 또한 프런트 엔드 기술 개발을 홍보할 수 있습니다. CSS3, 무한 부하, 온라인 편집기 아바타, 기술의 많은 방법 디자인 변경, 다시가 서 한 단계 더!

원본 주소: http://www.aliued.cn/2012...e8%af%86.html