表示方式が変わる方法 - DHTML表示方式が変わることによって隠されたメニューが出現します。DHTMLの機能です。動的なページを作ることが出来ます。 、マウスをクリックすると「Display(id)」が呼び出されています。 「document.all(id).style.display」、「document.getElementById(id).style.display」 で表示非表示を変更しています。
CSSのパターンマッチング記法
CSSではいくつものパターン名が使えます。 結構複雑ですが、知っていると便利なものもあるので頑張ってマスターしましょう。 * 全てのエレメントにマッチします。 * { ... } <span>Match</span> <div>Match</div> E E要素のエレメント全てにマッチします。 div { ... } <span>not match</span> <div>Match</div> E.warning E要素のうち、class属性にwarningが含まれるものにマッチします。 E[class~="warning"] と同等です。 この記述法は、HTML文書でのみ有効な簡易記法です。 div.section { ... } <div>not match</div> <div class="section">Match</div> Eを * とするか省略すると、全要素が対象となり
もう、class名やid名で悩まないんだからっ！！｜CSS HappyLife
class名やid名って付ける時悩みませんか？ 今でもボクは結構悩むんですが、そんな悩みを解決する為に、人さまのソース覗きまくってよくあるclass名とid名を拾ってきました。 これで、チョットだけ作業効率アップ！？ 2010年6月10日追記： この記事自体、2007年 1月15日に書かれてるんでかなり古いです。 あくまでも参考程度に留めてもらうのが良いかと思います。 今だったら、html5の要素を参考にしたりして付けるのが、今後の事を考えると良いのかなーと思います。 また、善し悪しの判断はせずに公開しているものですが、位置に関するのは仕様変更に弱くなるのでオススメはしません。 全体に使えそうな感じ wrap wrapper top-wrapper wrapperAll frame mframe all-frame container page pagetop all allContent
PHPでCSSを生成することによるテクニックが紹介されています - PHPプロ！ニュース
平素より「PHPプロ！」をご愛顧いただき、誠にありがとうございます。 2006年より運営してまいりました「PHPプロ！」ですが、サービスの利用状況を鑑みまして、2018年9月25日（火曜日）をもちましてサービスを終了させていただくことになりました。 サービス終了に伴いまして、2018年8月28日（火曜日）を持ちまして、新規会員登録ならびにQ&A掲示板への新たな質問、回答の投稿を停止させていただきます。 なお、ご登録いただいた皆様の個人情報につきましては、サービス終了後、弊社が責任をもって消去いたします。 これまで多くの皆様にご利用をいただきまして、誠にありがとうございました。 サービス終了に伴い、皆様にはご不便をおかけいたしますこと、心よりお詫び申し上げます。 本件に関するお問い合わせはこちらよりお願いいたします。
Lucky bag: : blog: 背景画像に使える透過 GIF
斜線やストライプの背景画像を Photoshop とかで作ると、色を変えたくなった時にそのたび作り直しってのが面倒。便利で使ってる人も多いかもしれない secondlife さんの Background Image Maker でもそれは同じかな。んで、Photoshop とかで作る場合に、線に色を付けて作るんではなくて、色を付けたい部分を透過にして作っておいて CSS で background-color を指定するやり方にすれば、色を変えたくなった時はCSS で背景色を変更するだけで良いじゃんって、Super Stripes を見て目からうろこ状態。早速インスパイヤしてみた！ 使ってみたい GIF 画像をダウンロードして、CSS で背景画像に。あとは、背景色で好みの色を指定するだけ。ちなみに、サンプルでは背景色を #fa0 と指定している。 斜線 oblique-line_1px.gi
DIVを垂直方向に中央寄せするCSSサンプル:phpspot開発日誌
Blue Box Demo: Vertical Centering with a Shiv Div DIVを垂直方向に中央寄せするCSSサンプル。 次のように、DIV要素をブラウザの縦方向に配置できます。 CSSは非常にシンプルで、まず、html と body 要素に height:100% プロパティを設定します。 次に、body内にdiv要素を配置し、そのdiv要素に対し、height:50% かつ、margin-top:-50px のようにプロパティをあて、 中央寄せしたい要素(上図中、青い部分)の半分のサイズ分のマージンをマイナスします。 最後に中央寄せしたいdiv要素( height:100px ) を配置することで、青い部分は中央によります。 垂直方向に、100px のdiv要素が配置される感じです。 <html> <head> <style type="text/css">
CSSを使い、１枚の画像だけでカラフルなグラデーション背景を作る例:phpspot開発日誌
A List Apart: Articles: Super-Easy Blendy Backgrounds CSSを使い、１枚の画像だけでカラフルなグラデーション背景を作る例。 次のような透過PNGがあったとして、更にこの下に色を付けると・・・。 大体どうなるか分かると思いますが次のようなグラデーション背景が出来ます。 そんなCSSのテクニックが紹介されてます。 example one (FireFoxのみ) example two (FireFoxのみ) example three (FireFoxのみ) example four (FireFoxのみ) Example five (FireFoxのみ) Example six (IEも動きます) Example seven (IEも動きます) アイデア次第でこういった技もできてしまいますね。 通常なら画像をPhotoShopなんかで
bnote
~/.bash_profile の代わりは ~/.profile Ubuntu のどのバージョンからかわかりませんが、 ~/.bash_profile がありません。 そのかわりに、 ~/.profile を使うようです。 ~/.profile の中を確認すると、次のようにコメント [Read More]
CSSによる画像切替（ロールオーバー）に成功！ ― #BLOG
以前のエントリー「#BLOG: CSSで画像を動的に切り替えるには？」で、横に画像を並べるタイプの画像切替（ロールオーバー）について書きました。そのときは、私の力だけでは完成せず、とは言ってもせっかく調べたので、調査内容をとりあえず公開していました。 すると親切にも、Momomoさんのブログ「Alternative Design Project」と、森田雄さんのブログ「securecatのMT」からトラックバックをいただき、いろいろと勉強させていただきました。 Momomoさんや森田雄さんのロールオーバー実現方法は…… <ul>タグと<li>タグを使って項目リストを作り、この<li>タグのリスト項目をブロック要素（改行されて1つのまとまりとなる要素）からインライン要素（改行されずにダラダラと後ろに続く要素）に変更して横に並べ、リスト項目の背景画像を動的に切り替えるという方法です。 この方法
CSSの識別名にアンダースコアを使う
CSSの識別名(identifier)には、アンダースコア(_)が使えるわけですが、どうやらInternet Explorer 5以降には、これにまつわるちょっとしたバグがあるみたいです。そのバグというのは、「識別名の先頭にあるアンダースコアを無視する」というもの。CSS: The Underscore Hackで見つけました。 Underscore ("_") is allowed in CSS identifiers by the CSS2.1 Specification Browsers have to ignore unknown CSS properties Windows IE 5+ doesn't recognize the "_" at the beginning of CSS property name このページの例にもあるように、こんな書き方をするとMozillaやO
Lucky bag::blog: CSS を作成する際のお約束
CSS を作成している際に、当然の如くブラウザによって描画結果に違いが出てくるわけで、ムキーとか言いながらその差異を埋めていく作業が一番面倒っちゃあ面倒。んで、ボックスモデルやその他ブラウザごとのバグ以外で、極力そう言った差異を少なくするためには、一番最初に全称セレクタを使ってブラウザのデフォルトスタイルを消してしまうのが手っ取り早い。 * { margin: 0; padding: 0; font-style: normal; font-weight: normal; } ここらへんは基本だと思ってたんだけど、未だにこれをやっていなくて、あのブラウザとこのブラウザで見た目が違うんですけどってのは結構いたりする。上記に text-decoration: none; や font-size: 100%; なんかを加えても良いかも知れないけど、最低限マージンとパディングは無くしておくことをお薦
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://homepage.mac.com/mikihiro/md/web/table.html
CSS Tips：メモランダム