タグ

CSSとweb制作に関するooze-flashのブックマーク (6)

  • [使える CSS テクニック] 実案件でも使える!フッターをブラウザ下部に固定する方法 | バシャログ。

    暑い夏がやってきそうなので、久しぶりにツーブロック的な刈り上げにしてみましたishidaです。 今回は最近作業した案件で、これまであまり実践的に使わなかったCSSレイアウトを2サイト連続で使ってみたので、ご紹介。自分も忘れないようにメモ的エントリーです。 ページ下部に固定されるフッターを実現するためのCSSレイアウトです。 positionで実現する方法もありますが、コンテンツ量によっては表示が崩れるので今回は直球勝負です。 XHTML ソースはこんな感じになります。 <div id="container"> <div id="header"> ヘッダー <!-- /#header --></div> <div id="content"> <h1>フッターをブラウザ下部に固定するサンプル</h1> <p>文が入ります。文が入ります。文が入ります。</p> <!-- /#content

    [使える CSS テクニック] 実案件でも使える!フッターをブラウザ下部に固定する方法 | バシャログ。
  • ul と ol って何の略? - gan2 の Ruby 勉強日記

    すぐに忘れそうなのでメモ。 ul は Unordered List の略。順序のないリスト。 ol は Ordered List の略。順序のあるリスト。 li は List Item の略。li は ul や ol などのリストの子要素。 ul の例 りんご バナナ いちご <ul> <li>りんご</li> <li>バナナ</li> <li>いちご</li> </ul> ol の例 はじめに つぎに さいごに <ol> <li>はじめに</li> <li>つぎに</li> <li>さいごに</li> </ol> CSSの話じゃなくてHTMLの話なんだけど、 このために新しくカテゴリ作るのもどうかと思ったので、 とりあえずCSSのカテゴリにしてみた。 っていうかけっこう久しぶりの投稿だなー。 参考 リストの作成 -- ごく簡単なHTMLの説明

    ul と ol って何の略? - gan2 の Ruby 勉強日記
    ooze-flash
    ooze-flash 2011/03/08
    参考になった
  • 【レビュー】自由に使えるiPhone/iPad/Android/PC向け切り分けCSSテンプレート | エンタープライズ | マイコミジャーナル

    Fantastic website design in Flintshire, North Wales from Stuff and Nonsense iPhoneAndroid携帯といったスマートフォンからiPadのようなポータブルデバイス、従来のPCやノートPCにいたるまで、ネットワークにアクセスするデバイスの種類は多様化している。こうしたディスプレイサイズも解像度密度も異なるデバイスに対してそれぞれに適したデザインを提供するというのが、最近のWebデザイナの間で取り上げられることが多いトピックになっている。 こうしたトピックで取り上げられることが多いテクニックがCSS3のMedia Queryを使う方法だ。デバイスの解像度や密度の情報を取得して、それに応じて適用するCSSを切り替えるというもの。これまで多くのブログでこのテクニックが取り上げられ、サンプルコードとともに紹介されている

  • [CSS]横スクロール時にヘッダやフッタが切れてしまう時の解決方法

    ヘッダやフッタがブラウザの横幅より広い際に、横スクロールするとヘッダとフッタが切れてしまうのを解決する方法を紹介します。 これはIE6などの旧式のブラウザだけでなく、Firefox3.6やChromeでも起きる現象です。 How to Resolve a Fluid Header/Footer Problem When the Window is Resized デモページ(不具合版) ※キャプチャはFirefox3.6(不具合の確認は横幅を小さくして) この現象が起きる条件は下記のようになります。 ヘッダとフッタのサイズは指定されていない。 →横いっぱいに広がる。 コンテンツエリアのサイズは指定されており、「margin:auto;」で中央に配置。 ブラウザのサイズはコンテンツエリアのサイズより小さい。 →ブラウザに横スクロールバーがでる。 期待される表示は、下記のようにコンテンツが中央

  • 日本語版 WordPress チートシート | Webクリエイターボックス

    2024年7月21日 Wordpress, ダウンロード WordPressの覚え書きというか、カンニングペーパーです。コードなんぞをまとめました。他にもWordPressのチートシートはいたるところで記事にされていますが、CSSハックやCSS小技集に続き、これもまた自分用まとめだったり…。例文も私がよく使うものをコピペしやすいように置いてます。A4サイズの印刷用も作ってみたので、「これ使えるかも!」と思った方は印刷してデスクに置いておくと便利です :) ↑私が10年以上利用している会計ソフト! WordPressチートシート 目次 印刷用WordPressチートシート WordPressテンプレートファイル インクルードタグ テンプレートタグ テンプレートタグ/bloginfo 条件分岐タグ ループ ナビゲーションメニュー 1. 印刷用WordPressチートシート A4サイズの印刷用P

    日本語版 WordPress チートシート | Webクリエイターボックス
  • より早くcssやhtmlのコーディングが行えそうな情報いろいろ - かちびと.net

    Web制作を少しでも効率化しよう と思って(今更)いろいろ便利そう な情報を探しました。既に使って いる情報の方が多かったのです が、折角調べたのでシェアしたい と思ってエントリーです。 コーディングをもっと円滑に、という旨の情報です。順不同。あんまり多いと逆効果なので量は絞りました。一応これでも絞りました。絞ったつもり。 zen-coding 話題になったzen-coding。だいぶ慣れて来た方もいらっしゃるのでは。 zen-coding(家) HTMLコーディングが3倍速くなる?「Zen-Coding」 秀丸Zen- Codingマクロ コーディングの効率化を図るZen codingをDreamweaver cs4に入れる方法 WP Zen-Codingが凄く便利 初期設定とかTipsとか 制作前に知っておくと便利なコードとかTipsいろいろ。 css書く前にチェック。 もう、cla

    より早くcssやhtmlのコーディングが行えそうな情報いろいろ - かちびと.net
  • 1