[CSS]クロスブラウザ、マルチカラム対応のフッタを下部に固定表示するスタイルシート
New CSS Sticky Footer - 2009 demo 主な対応ブラウザは、IE6/7/8, Fx2/3, Op9.6/10, Safari3.2, Crome1となっており、他にも多くのブラウザに対応しています。 対応ブラウザリスト New CSS Sticky Footerは、同じくフッタを下部に固定表示する「CSS Sticky Footer」の空divの使用を排除しHTMLをよりクリーンにし、マルチカラム対応にしたものとのことです。 仕組みはシンプルで、下記が最小の構成になります。 HTML マルチカラムの場合は、「id="main"」のdivに配置します。 <textarea name="code" class="html" cols="60" rows="5"> <div id="wrap"> <div id="main" class="clearfix"> </d
[CSS]背景画像をページの最下部に固定表示させるスタイルシート
Fixed Footer Backgrounds with CSS demo, demo 2 デモではスクロールバーの有無の２パターンがあり、スクロールをしてもブラウザのサイズを変更しても背景画像がフッタの位置に固定表示されています。 仕組みの概要は、bodyに背景色と背景画像を指定し、背景画像は「fixed bottom」にします。 コンテンツを内包するdiv（headwrap）を設置し、ページ上部に表示される背景画像を指定します。 <textarea name="code" class="html" cols="60" rows="5"> <body> <div class="headwrap"> <div class="container">Content</div> </div> </body> </textarea>
写真の印象を一気に激変させて美しくするPhotoshopのお役立ちアクション61種類
Photoshopの一連の手順（画像のサイズを変更し、画像に効果を適用し、ファイルを目的の形式で保存するなど）を記録し、次回以降は一発でできるようにしてくれる自動作業機能のことを「アクション」と呼びます。このアクションを使えば、大量の画像をまとめてバッチ処理したり、いろいろと便利なわけですが、今回は写真の見栄えを美しくしたり、違う印象を与えるように加工するアクション61種類です。かなり便利なものが多いので、写真加工を頻繁かつ大量に行う人にはかなりお役立ちなのではないかと。 60種類の詳細は以下から。 いわゆる「クロスプロセッシング」を行うアクション ロモ・クロスプロセッシング ビンテージ風 HDR（ハイダイナミックレンジ）風 色あせたビンテージ風 肌のでこぼこを修正してなめらかに見せる いろいろなパターンのモノクロ写真へ変換 明度やコントラスト、シャープなどをブーストする ダークトーン・ミ
PhotoshopのPSDファイルを無料でゲットできるサイトいろいろ - GIGAZINE
PSDファイルとは、Photoshopのデフォルトのファイル形式であり、レイヤー構造や画質などがかなりそのまんまなので、いろいろとこのPSDファイルを元にしてサイトのデザインや素材作成などに利用されています。Photoshopを持っていなくても、例えばフリーソフトの「Paint.NET」とPSDファイルの読み込み・編集ができるようになる「Photoshop file plug in」を組み合わせれば、完全無料で利用可能になります。また、PhotoshopのPSDファイルをXHTML＆CSSに一発変換できる「psd2css」というような無料サービスもあります。 というわけで、いろいろな局面で役に立つPhotoshopのPSDファイルを無料でダウンロードできるサイトいろいろは以下から。 60 Most Wanted Photoshop Tutorials, Brushes, .PSDs and
これさえやればCSSをマスターできるかもしれないCSSチュートリアル＆サンプル20:phpspot開発日誌
皆さん、新年あけましておめでとうございます。 今年も読んでいただき、ありがとうございます。 では、早速ですが記事のご紹介。 20 Ultimate CSS Tutorials That Will Help You Master CSS | DWSmg.com これさえやればCSSをマスターできるかもしれないCSSチュートリアル＆サンプル20。 全部、そのメカニズムについて覚えたらかなりCSSに詳しくなるのは間違いなさそう。 Advanced CSS Menu カーソルを合わせたときにメニューがCSSオンリーで切り替わる CSS Based Navigation こちらも同様。JavaScriptレスでメニューを切り替えます CSS Fancy Menu CSSとJSを使ってFlashばりのアニメーションメニューを作成 Expandable CSS Tabs Tutorial テキスト長に応
めも - IT戦記
このメモについて id:amachang の私的な学習目的 IE6 の標準モードに関するバグ いろいろとポイント layout IE6 の視覚整形モデルの中で要素は、大きく分けて layout を持つ要素と、 layout を持たない要素に分けることができる。 layout を持つ要素とは、自分のサイズや位置に責任を持つ要素である。 layout を持つ要素は、四角形の領域を作る。 layout を持たない要素は、直近の layout を持つ要素のサイズおよび位置と、そこの間にあるすべての要素の margin, padding, border によってその開始点、折り返し点が決まる。 layout を持たない要素は、四角形の領域を作らない。上下左右の間隔を保持しているだけに過ぎない。 layout を持たない要素間の上下マージン（相殺されるマージン）は二つの要素間の共有のもので、ある要素特
3分間で大型ポスターを作成できる無料アプリ『Block Posters』 | WIRED VISION
3分間で大型ポスターを作成できる無料アプリ『Block Posters』 2008年11月11日 IT コメント： トラックバック (0) Jose Fermoso シンプルな無料オンライン・アプリケーション『Block Posters』を使えば、自分のお気に入りの画像を印刷可能なPDFファイルに変換し、壁紙サイズの巨大ポスターを作ることができる。 必要なものは、数分の時間と数セントの用紙、そしてハンディプリンターのみ。しかも、仕事の片手間に作成できるうえ、このポスター作成アプリケーションは完全に無料なのだ。 作り方を説明しよう。自分のコンピューターからBlock Postersのサーバーに画像をアップロードし、ポスターを用紙何枚分の幅にしたいか選んで、印刷設定(ポートレイト、ランドスケープ、A4、USレターサイズ)を選択する。こうして設定したPDFファイルを保存したら、画像の端まできちん
窓の杜 - 【REVIEW】軽快に使えるフリーのペンタブレット用お絵描きソフト「vnp LE」
「vnp LE」は、ペンタブレットを使ってお絵描きができるフリーソフト。Windows XPに対応しており、作者のWebサイトからダウンロードできる。 本ソフトのペンツールは、ペンタブレットの筆圧感知に対応しており、ペンやエアブラシのような自然な線を引くことができる。このペンは、サイズや色だけでなく“間隔”“テクスチャ”“ジッター”といった特殊な設定を備えているのが特長。 “間隔”の数値を大きくすれば、描画間隔が大きくなり、点線を引くことができる。“テクスチャ”の値を大きくすれば、ペンで塗った場所へテクスチャーによる模様を描画することが可能。また、“ジッター”の値を大きくすれば、描画点がペン周囲に散らばる。この“ジッター”の効果を利用して、散布ブラシや、にじみ風のペンを作ることが可能だ。ペンの細かな設定は、キャンバスの左上にある赤い縦長の四角形をクリックすることで表示される。 画面は、中央
会員登録の敷居を下げる入力フォームの作り方(PC編) - キャズムを超えろ！
本エントリは、20〜40代のPCをある程度使いこなしているユーザー向けの会員登録フォームの設計について述べたものである。ケータイサイトは含まないし、シニアも対象としていない。シニア向けUIについては(古いエントリだが)こちら "ユーザーID"と"メールアドレス" 減ってはきたものの、ユーザーIDとメールアドレスの両方を取るWebサービスがいまだに結構ある(ex. Remember the milk)。はてなやYahooAuctionのように「ユーザーIDがニックネームに相当するコミュニティサイト」は除くとして、ユーザーIDを一般客に公開しないにも関わらずIDとメルアドの両方を取る意図がわからない。 ユーザーIDとしてメールアドレスを使うメリットは 会員登録フォームの入力必須箇所が1個減る 好みのIDが取れない事件が防げる "ID忘れ"による機会損失/幽霊会員が減る 流石に自分のメアドは忘れ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
http://www.designwalker.com/2009/01/web-layout.html
http://e0166nt.com/blog-entry-569.html
https://www.openvista.jp/archives/note/257/?257/