1

テキストに活版印刷効果を与えることができるように、色の値/名前を正しく取得できないようです。

スタンプされたテキストの外観を作成するには、背景よりも暗いテキストの色を選択してから、1ピクセルのぼかしで1ピクセルのテキストシャドウを作成し、1ピクセル下にオフセットします。テキストの影を背景より少し明るくします

background-color: rgba(255, 255, 255, 0.8);
color: #222;
text-shadow: 1px 1px 1px #FFFFFF;

これまでのところ私はこれだけを手に入れます

ここに画像の説明を入力してください

どうすればいいですか

  1. 背景よりも暗いテキストの色を見つけます。背景色はrgba(255、255、255、0.8)で、テキストの色は#222です。
  2. 背景よりも明るいテキストの影の色を見つけます。背景色はrgba(255、255、255、0.8)で、テキストの影の色は#FFFFFFです。

テキストの色(現在は#222)を暗い色に変更し、テキストの影の色(現在は#FFFFFF)を背景色(現在はrgba 255、255、255、0.8)に対して明るい色に変更する必要があります。背景色を他の色に変更することはできません。

デザインのスキルがなく、テキストの色の値やテキストの影をどのように変更して活版印刷の効果をより明確にするかを誰かが考えているかもしれません。

ありがとう

4

4 に答える 4

2

いくつかのテキストシャドウのこの使用をいじくりまわす---

http://jsfiddle.net/sheriffderek/bTZs9/1/

ぼかしは実際にはフォントサイズに依存します...そしてrgba色を使用すると、紙の色に一致するさまざまな色合いを見つけることから推測作業を取り除くのに役立ちます...

ここに画像の説明を入力してください

于 2012-08-20T23:10:03.613 に答える
1

テキストシャドウのぼかしを少なくしてみませんか?

使用しているもの:

color: #222;
text-shadow: 1px 1px 1px #FFF;

ぼかしの使用を減らすと、テキストシャドウがより一般的になります。

color: #222;
text-shadow: 1px 1px 0px #FFF;

この場合、ぼかしは3番目のパラメーターであり、活版印刷のような効果を出すためでは0pxなく、の値を設定する必要があります。1px

于 2012-08-15T04:02:41.283 に答える
0

色#222はとても暗いです。インクをスタンプするには、#333または#444を使用する必要があります。そして、インクは固いものではありません。あなたはこのようなものでテキストにいくらかのノイズを与える必要があります:http://www.mightymeta.co.uk/demos/css-noise/

于 2012-08-15T01:32:07.363 に答える
0

少し凝ったものですが、疑似要素を使用できます。



JSFiddle

http://jsfiddle.net/Asustaba/MLEwp/



CSS

    #stamped {
    表示ブロック;
    色:白;
    フォント:3em Arial、sans-serif;
    位置:相対;
    }

    #stamped:before、#text:after {
    コンテンツ:attr(title);
    色:#222;
    位置:絶対;
    }

    #stamped:before {top:1px; 左:1px; }
    #stamped:after {top:2px; 左:2px; }



HTML

    <h1 id = "stamped" title = "CATTLE FARMS"> CATTLE FARMS </ h1>

于 2012-08-15T03:34:36.103 に答える