CSS를 사용한 활자 효과

활자 효과를 CSS에서 과 같이 만들고 싶습니다. 하지만 나는 그것에 대한 올바른 텍스트 그림자를 찾을 수 없습니다. 단어의CSS를 사용한 활자 효과

색상 : #의 2f4050 배경의 색상 : #의 4f6478는

나는 그것을 시도했다 :

.letterpress { 
    color:#2f4050; 
    font-family:Tahoma, Helvetica, Arial, sans-serif; 
    font-size:70px; 
    font-style:normal; 
    font-variant:normal; 
    font-weight:normal; 
    line-height:normal; 
    text-align:center; 
    text-shadow:#4f6478 0 1px 5px; 
}

하지만 그 트릭을 할 것 같지 않습니다.

출처

2012-05-31 Bart De Kimpe

당신이 링크 한 이미지가 깨졌습니다. 적어도. – cchana

예 이미지가 손상되었습니다. – Katti

http://img208.imageshack.us/img208/6421/letterpress.png –

.letterpress { 
    color:#2f4050; 
    font-family:Tahoma, Helvetica, Arial, sans-serif; 
    font-size:70px; 
    text-align:center; 
    text-shadow: 0 1px 1px #fff; 
}

을 쥐게. Btw. "보통"값 쌍을 선언 할 필요가 없습니다.

출처

2012-05-31 09:33:34

Fiddle : http://jsfiddle.net/ThZce/ –

그림자에 밝은 색상을 사용하고 흐림을 줄입니다. 예 :

text-shadow: 1px 1px 2px #6ab;

출처

2012-05-31 09:32:12 Guffa

텍스트 그림자는 배경색과 동일합니다. #809bb5과 같이 밝은 색을 사용해야합니다. 또는 rgba 값 (예 : text-shadow: 0 1px 5px rgba(255,255,255,0.4);)을 사용할 수 있습니다. 마지막 숫자는 알파 투명도 (불투명도)입니다.

나는 그것을해야 약간의 그림자 ... http://jsfiddle.net/qmqF5/

출처

2012-05-31 09:33:07 Mindthetic

두 개의 그림자가 있습니다. 오른쪽 아래 왼쪽 상단에 투명 블랙 내부 그림자에 투명한 흰 그림자를 제공해야

text-shadow: 1px 1px rgba(255,255,255,0.2), -1px -1px rgba(0,0,0,0.5);

이 같은 것을보십시오.

출처

2012-05-31 09:34:23 Stefan

여기의 문제는 간단합니다.

배경색과 텍스트 그림자에 동일한 색상을 사용하고 있습니다.

배경에 비해 텍스트 그림자에 밝은 색상을 적용하면 텍스트 색상이 문제를 해결합니다.

감사합니다.

출처

2012-05-31 09:36:52 Katti

활자 효과를 만들려면 효과가 올바르게 적용되도록 텍스트의 색보다 밝은 그림자를 추가해야합니다.

출처

2013-12-22 10:29:30

CSS를 사용한 활자 효과

답변

관련 문제