2014-12

HTML&CSS

アイコンフォントの使用方法〜疑似要素への導入方法も追加

アイコンフォントとは アイコンフォントとはWebフォントと同じような仕組みでサーバー上のアイコンを表示する仕組みです。 アイコンフォントの使い方 疑似要素に導入する方法はこちら Font Awesomeを例にしてCDN(Cont...
PhotoShop

ドットグラデーションの作成〜Photoshop

ドットグラデーションを加えると通常のグラデーションより随分印象が変わります。 手軽にできますので作成方法を覚えておきましょう。 まず、通常のグラデーションを作成します。 ポイントは白と黒でグラデーションを作成することで...
php&MySQL

\nのクオテーションはダブル〜PHP

文字列内で改行を表す特殊文字「\n」を改行として使用したい場合は、「"」を使用します。「"」は特殊文字を理解して改行します。ところが、「'」は「\n」を改行として表示せずにそのまま「\n」で表示します。 HT...
HTML&CSS

イメージマップのリンク部分の青い線を消す

Chromeなどでイメージマップのリンク部分に青い線が表れます。 これを消すにはareaに対してCSSでclassなどを使用して以下の設定をします。 IEの古いバージョン対策ではHTMLタグの中に以下の属性を加えます。
HTML&CSS

floatとdisplay:inlineを一緒に設定する理由〜CSS

時々CSSでfloatとdisplay:inlineを同時に指定するコードを見ることがあります。 なぜ、floatして横並びにしているものをわざわざdisplay:inlineにして幅とか高さとか設定できなくなるのでは?と考えてしまいます...
PhotoShop

ベベルとエンボスの正体〜Photoshop

Photoshopで作成したオブジェクトを盛り上げたり、くぼませたりするのにベベルとエンボスを使用しますが、いまひとつ正体の分からないまま使用していませんか。今回はベベルとエンボスを掘り下げみたいと思います。 そもそもベベルとエンボスとは...
Illustrator

jQuery.extendを使ってみる

jQuery.extendとは jQuery.extendは複数のオブジェクトをマージして返します。 と言われてもよくわかりませんので使い方を見てみます。 もっとも簡単にJavaScriptでオブジェクトを作成するには連想配列を作...
Illustrator

過去のアピアランス効果が適用される〜Illustrator

アピアランスを使用して何らかの効果をつけたり、変更した後に、次の新しいオブジェクトを作成するとその前に使用したアピアランス効果がそのまま適用される場合があります。 例えば、鉄道の線路をアピアランスを使用して作成した後に、通常の線を引いても...
HTML&CSS

ul要素の構造〜余計な余白は誰?

ul要素とli要素はナビゲーション作成などで使用頻度の高い要素です。 リストは特殊な構造になっています。 ulとliは組み合わせて使用する必要があります。 特にulの直接の子供はliのみとなりますので、ulの入れ子状態で再びulを使用...
Illustrator

Illustrator〜1ピクセル単位で正しく保存する

Illustratorでイラストを作成してpngやgif形式にして保存する場合に、1pxまたは2pxサイズが大きくなることがしばしばあります。 それがシンプルな四角形であっても1pxまたは2pxの誤差がでます。 この原因は作成しているオブジェクトのx,y座標や幅と高さに1px以下の少数点が含まれているときに発生します。または線の位置の問題もあります。 Webの素材を作成するときには、最低単位を1pxにしないと保存の時にサイズのズレが生じたり、エッジに滲みが生じる原因になります。
スポンサーリンク
タイトルとURLをコピーしました