DIVを垂直方向に中央寄せするCSSサンプル:phpspot開発日誌
Blue Box Demo: Vertical Centering with a Shiv Div DIVを垂直方向に中央寄せするCSSサンプル。 次のように、DIV要素をブラウザの縦方向に配置できます。 CSSは非常にシンプルで、まず、html と body 要素に height:100% プロパティを設定します。 次に、body内にdiv要素を配置し、そのdiv要素に対し、height:50% かつ、margin-top:-50px のようにプロパティをあて、 中央寄せしたい要素(上図中、青い部分)の半分のサイズ分のマージンをマイナスします。 最後に中央寄せしたいdiv要素( height:100px ) を配置することで、青い部分は中央によります。 垂直方向に、100px のdiv要素が配置される感じです。 <html> <head> <style type="text/css">
CSSの小技集、20個:phpspot開発日誌
CSS Techniques Roundup - 20 CSS Tips and Tricks I never cease to be amazed at what problems can be solved with pure CSS. CSSの小技集、20個。 どのテクニックも、誰もが使うであろうテクニックで便利なものばかりです。 角丸 画像なしの角丸 投票用スターの作成 テーブルなしのフォーム リストをＣＳＳでデザイン 2カラムレイアウト 3ラムレイアウト 3カラム固定幅、中央寄せ 印刷とＣＳＳ RSSフィードにスタイルシートを指定 固定フッター 要素にHoverエフェクトを加える HRタグへのCSS ＦｌｏａｔのClearに関するテクニック CSSでポップアップ小窓 ボックスの見出し(Box Punch)を表現 CSSボタン オレンジのRSSボタンをP
CSSだけでフレームを作るテクニック:phpspot開発日誌
CSS Frames v2, full-height | 456 Berea Street Way back in August of 2003 I wrote a short article called CSS Frames, in which I described a technique to emulate the visual appearance of HTML frames with CSS. CSSだけでフレームを作るテクニック。 通常、フレームというとframeタグを使って実現しますが、検索クローラーに対して不利などの理由から最近ではあまり見かけなくなってしまいました。 フレーム風のインタフェースをＣＳＳだけで実現するテクニック。 常にヘッダー、フッターのナビゲーションが固定されているのでフレームの使いやすさはそのままで、かつクリーンなHTMLによってフレームを実現でき
超クールな映画SinCity風の画像を作るPhotoShopチュートリアル: phpspot開発日誌
Sin City Style - Tutorial Seeker 映画、Sin City風の画像を作るPhotoShopのチュートリアルがあったので試してみることにしました。 次のようにSinCity風に画像に加工を加えてみます。 1) まず「イメージ→色調補正→レベル補正」によって、画像のコントラストを上げます。 ※レベル補正の説明 2) 「フィルタ→アーティスティック→カットアウト」で画像の輪郭を大まかにします。 ・レベル数は２、エッジの単純さ３、エッジの正確さ２、でカットアウト適用 3) 次に雨を降らせるエフェクトを付けるために、画像を作成します。 ・新規レイヤーを作成し、５０％グレーで塗りつぶし ・「フィルタ→ノイズ→ノイズを加える」で量を400%(最大)にしてノイズを加えるでノイズを付けます ・「フィルタ→ぼかし→移動」で「角度90°距離999px」を選択して実行します。 ・これ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
