タグ

ブックマーク / www.webbibo.com (3)

  • CSSプロパティを記述する際の順番のサンプル|web bibo

    人によって様々な書き方があるCSSプロパティの順番。今回は参考になりそうなサンプルを紹介します。 「CSSプロパティの記述順序 - かたつむりくんのWWW」で紹介されていました分かりやすくキレイにまとまったサンプルです。Mozillaの順序をベースに、W3Cの仕様書(CSS2 Specification)と「Web標準の教科」の順番をミックスしたものらしいです。 CSSプロパティの記述の順番 1.表示や配置など「視覚整形モデル」に関するプロパティ display list-style** 1. list-style-type 2. list-style-image 3. list-style-position 4. marker-offset(CSS2.1勧告候補では削除) position** 1. top 2. right 3. bottom 4. left float clear z

  • inputボタンを画像にするCSS|web bibo

    inputボタンに type="image" を使って送信ボタンを作成することがあると思いますが、こうするとそのボタンのx,y座標がGET値で送信されます。GET値で送りたいけど、x,y座標は表示したくない場合はスタイルシートを使ってinputボタンの背景に画像を指定します。 type="image"だとURLの後に座標の値がくっつく。 <form> <input type="image" alt="Sample" width="100" height="30" src="images/tips/image_btn.png" /> </form> CSSで解決 <form> <input type="submit" value="" id="image-btn" /> </form> #image-btn { border: 0px; width: 100px; height: 30

  • テキストボックスを画像の下に回り込ませない方法|web bibo

    /* CSS(スタイルシート)に関する知識・テクニックなどの備忘録 */ 文字サイズ 大 中 小 現在のページ: HOME » CSS レイアウト・ボックス » テキストボックスを画像の下に回り込ませない方法 画像のサイズが変わっても、隣接するテキストボックスは画像の下に回り込まず、なおかつ、テキストボックスのサイズが画像に合わせて自動的に変わる方法をご紹介します。 画像のサイズが変わってもテキストが折り返さない 大きい画像から小さい画像に差し替えることになっても、テキストが折り返すことはなくなるので、簡単に更新作業ができます。 HTML 下記の通りHTMLを記述します。 <div class="box"> <img src="images/text_wrap.jpg" alt="" /> <p>text text text text text text tex

  • 1