CSS3(Cascading Style Sheets,level 3)がいよいよ実用段階に入ってきた。大半のモダンブラウザーで実装が進み、アップルやグーグルなどの先進企業がCSS3を本格的に活用し始めている。デザイン表現の自由度を広げ、マークアップの効率を上げるCSS3のTipsを具体的なサンプルとともに紹介する。
![菊池 崇の実践!CSS3道場](https://cdn-ak-scissors.b.st-hatena.com/image/square/6f182fdcf6ff200bb90121d0c23ab7c9dd90291f/height=288;version=1;width=512/https%3A%2F%2Fascii.jp%2Fimg%2F2011%2F01%2F18%2F286961%2Fl%2F243c300f4d8c91f6.jpg)
WebDesigning Ajaxハジメマシタ連載 掲載一覧 *連載サンプルはWebDesigningのサイトから実行およびダウンロードすることができます。 掲載号 タイトル サンプル概要 使用ライブラリおよびAPI 種類 2006年3月 CMSツール「っぽいもの」をAjaxで作る 非同期通信を使ってテキストファイルを読み込む なし テキスト 2006年4月 Ajaxで作る自動更新フォトギャラリー 連番画像ファイルを自動判別して読み込み表示 なし 画像 2006年5月 Excelファイルで更新できるページをAjaxで作る エクセル2002で出力されるXMLデータを読み込み表示 Prototype.js テキスト 2006年6月 AjaxでHTMLページにRSSリーダーを作る RSSリーダー JKL テキスト 2006年7月 無料ライブラリで作るお手軽Ajaxフォトビューア 画像スライドショ
floatを使った2段組で、右側が横幅固定で、左側が画面横幅の残りを可変でということをしたいとき、 どうしたら実現できるのでしょう。 例えば、左側を可変で右側を200pxとした場合、左側の width に100% - 200px と指定できれば問題ないのですが このような指定はできそうにありません。 これを解決する方法が ネガティブマージン になります。 [参考:Creating Liquid Layouts with Negative Margins] 可変にしたいほうの段のwidthを100%とし、marginをマイナスのピクセルを指定することによって リキッドレイアウト を実現することができます。 例えば、上記例のような場合、左側の段に width を 100% とし、margin-right を -200px と float:left を指定します。 左側の段の width は 1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く