CSS3
ポイントは、２つ。 text-shadowは繰り返し指定することができる 内側の色は文字色と同じ色にすることで、文字の輪郭がぼやけて発光を醸しだす コードは下記。 <html> <style> #boxC { width:500px; height:100px; float:left; background-color: gray; text-align: cente</html>…
text-shadowプロパティを使用して、文字に影をつけてみた。 <style> div#boxB p{ font-family:Myriad, Helvetica, Arial, sans-serif; color: black; font-size: 42px; line-height: 150%; /* 値は左から順に、影をつけるX方向の距離、Y方向の距離、ぼかしの大きさ</style>…
CSS3のtransformプロパティで、変形を試してみた。 下記画像をクリックすると検証サイトが開きます。 非常に面白い。平行移動するためのCSS。 transform:translate(平行移動させるpx); 傾斜変形のためのCSS。 transform:skewX(X軸方向に傾ける角度); 回転。 …
いつも忘れるので、ボックスのpadding,border,marginプロパティ,widthプロパティ,heightプロパティを図で理解する。まず、CSSはボックス単位を基本にしてレイアウトされる。 それで、１つのボックスは図のように4つの部分から構成される。 content：内容 pad…
下記画像をクリックすると、検証サイトが開きます。 これでスマフォ対応もばっちり！？ そこまで言い切るだけの知識と経験はないが、マークアップはHTMLで行い、デザインはCSSで行うという役割分担がしっかりされている場合は、media queriesでスマフォ用の…
