[B! webデザイン][html] mathemathikoのブックマーク

mathemathiko id:mathemathiko

webデザインとhtmlに関するmathemathikoのブックマーク (4)

clearfixでfloatを解除 | d-spica
clearfixでfloatを解除 2007-03-07 1 0 XHTML/CSS clear, CSS 枠や背景が消えたり，途中で切れたりしたことはありませんか。 floatした要素（ボックス）を含む親要素（ボックス）のborderやbackgroundが途中で切れてしまうことがあります。左の例では，右側のメニューが終わったあたりで，左右にあるラインも切れています。 floatした要素の高さは親要素の高さに反映されない分かりやすいようにXHTMLとCSSの例を書いてみましょう。 <div id="wrapper"> <div id="content"> <p>content</p> </div> <div id="menu"> <p>menu</p> </div> </div> #wrapper { width: 200px; border: solid 3px #999999;
mathemathiko 2012/09/06
わかりやすい。

webデザイン

css

HTML
リンク
サービス終了のお知らせ
サービス終了のお知らせいつもYahoo! JAPANのサービスをご利用いただき誠にありがとうございます。お客様がアクセスされたサービスは本日までにサービスを終了いたしました。今後ともYahoo! JAPANのサービスをご愛顧くださいますよう、よろしくお願いいたします。
mathemathiko 2012/08/31
webデザイン

html

css
リンク
CSSでfloatを指定したボックスを含むボックスの背景が出なくなる件 - Fsiki
「CSSで段組したらFirefoxで背景が出ねーよっ」て話をよく聞くので色々試してみました。コンテンツメニュー元になるHTML 特に何も考えずfloatを使った場合外のボックスに幅を与えてみる一般的な解決方法その他の解決方法 overflowを使う最終回答番外編更新履歴このドキュメントについて元になるHTML <div id="container"> <div class="leftBox">内容</div> <div class="rightBox">内容</div> </div> 例1(ブログ) class="leftBox"のボックスの内容は「サイドバー」。class="rightBox"の内容は「記事部分」。例2(ウェブサイト) class="leftBox"のボックスの内容は「ローカルナビゲーション」。class="rightBox"の内容は「情報」。例3
mathemathiko 2012/08/31
webデザイン

html

css
リンク
ブラウザ上で複雑なレイアウトが作れる「Layzilla.com」:phpspot開発日誌
HTML layout generator - Layzilla.com ブラウザ上で複雑なレイアウトが作れる「Layzilla.com」空白のキャンバスにボタンをポチポチ押していってドラッグ＆ドロップすることでレイアウトをどんどん組み立てられます。レイアウトを配置した例。それぞれ、ふちをドラッグすればリサイズ可能終わったらソースコードをジェネレート次のようなそこそこ綺麗なHTMLが出力できます。勿論、CSSも出力できます。関連エントリ複雑なCSSレイアウトをウェブ上で簡単に作成できる「The 1Kb CSS Grid」レイアウト作成に役立つCSSグリッドレイアウトジェネレーター集
mathemathiko 2011/11/15
html

webデザイン
リンク
1