タグ

cssに関するfoooのブックマーク (92)

  • DD_belatedPNG: better PNG background-image support in IE6

    We build tailored data systems for firms that depend on accuracy and speed. From finding new legal cases to extracting and analyzing custom financial data, every solution is designed to get you the best results. We write programs to acquire, sort, and filter large amounts of data. Our programs, refered to as “crawlers” or “spiders” get your information quickly, accurately, and effectively. This pr

    DD_belatedPNG: better PNG background-image support in IE6
    fooo
    fooo 2010/01/28
    background-position対応のie6透過png表示ライブラリ
  • Adobe Fonts

    Every font you need, everywhere you need it Find the perfect font

    Adobe Fonts
    fooo
    fooo 2010/01/26
    css3@font-faceで使えるOpenTypeフォントリポジトリ
  • [CSS]テキストを画像の下に回り込ませないようにするスタイルシート

    ちょっとしたトリックを使用して、テキストを画像の下に回り込ませないようにするスタイルシートをNO Margin No Errorから紹介します。 <textarea name="code" class="html" cols="60" rows="5"> <div class="content"> <img src="thumbnail.jpg" width="50" height="50" alt="Thumb!" /> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ligula arcu, luctus nec elementum quis, condimentum a lectus. Suspendisse potenti. Proin neque diam, dictum ac elementum

    fooo
    fooo 2009/12/15
    floatを使わずに、画像の非回り込みを実現させる
  • 画面中央にボックスの中心を配置する方法

    ウィンドウ画面の中央にボックスの中心を配置する方法の一つとして、以下のようにスタイルシートを2ステップで設定する方法があります。 STEP1 左上隅を絶対指定で画面中央へ スタイルシートのポジションプロパティを絶対指定(absolute)にして、ボックス左上隅をウィンドウ画面中央にあわせる(top:50%; left:50%)。 STEP2 マージンをマイナス方向へ ボックスの縦と横の半分ずつだけ、マージンをマイナス方向へ設定する。 完成サンプル 横120px 縦60pxのボックスの場合

    fooo
    fooo 2009/12/11
    Firefox,Safari,IE6/7で確認済み
  • BOS138 - Bandar Game Gacor Asia Mode Spin BarBar Ala Big BOS

    BOS138 - Bandar Game Gacor Asia Mode Spin BarBar Ala Big BOS BOS138 adalah bandar permainan digital yang menjadi destinasi Utama meraih maxwin dengan mudah di seluruh asia tenggara. Dapatkan bocoran spin barbar agar ikut kecipratan hoki dari para big bos!

    fooo
    fooo 2009/11/19
    良くあるcssパターンの簡単記述法
  • IE 6で泣かないための、9つのCSSハック (1/3) - @IT

    有限会社タグパンダ 喜安 亮介 2009/10/8 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック&フィルタTipsをお届けします(編集部) 最も多く使われているのに……、いや、だからこそ 多くのWebデザイナの悩みの1つは、レイアウトの表示ずれ問題だと思います。これは、各Webブラウザが採用しているレンダリングエンジンの違いから起因している場合が多いです。その中でも、最もWebデザイナ泣かせのWebブラウザなのは、マイクロソフトが開発しているIE(Internet Explore)のバージョン6です。 IE 6は、発売開始当初のWindows XPにデフォルトでインストールされていたWebブラウザということもあり、世の中の多くのユーザー

    fooo
    fooo 2009/10/09
    IE6対策のまとめ
  • [CSS]大きい画像をブラウザのサイズに合わせて背景に表示するスタイルシート

    CSS-Tricksから、大きい画像を余白を作らずにブラウザのサイズに合わせて、背景に表示するスタイルシートを紹介します。 Perfect Full Page Background Image 下記、それを実装する要件とテクニックを二つ、それぞれポイントをピックアップして紹介します。 実装の要件 前提として、画像のサイズを調整する必要があるため、background-imageプロパティでの配置は不適格とします。 それを踏まえ、以下の条件をクリアさせます。 ページは画像でいっぱいに、余白は無しで 画像の大きさは自動調整 画像の比率は維持 画像はページ中央に 画像はスクロールさせない クロスブラウザ対応 一つ目のテクニックは余分なマークアップが必要で、IE6用にJavaScriptを使用したものを紹介しています。 二つ目のテクニックは、余分なマークアップを無くし、JavaScriptも必要と

    fooo
    fooo 2009/09/11
    画面いっぱいの背景画像をブラウザサイズで可変にするCSS
  • How to Create a Beautiful Dropdown Blogroll Without JavaScript | Pro Blog Design

    How to Create a Beautiful Dropdown Blogroll Without JavaScript On Thu 23rd Jul | In WordPress | By Michael Martin 215 Dropdown menus are a great way of including a long list of links without cluttering up your page. The issue though is that they can be hard to style, but look quite ugly if you don’t. There isn’t a lot of flexibility with HTML’s <select> tags. Well, why not do it with plain HTML in

    fooo
    fooo 2009/09/02
    スクリプトを使わないで実装するドロップダウンメニュー。IE6などクロスブラウザ対応
  • ハッピー スターカジノで幸せな時間を過ごそう! - ハッピー スターカジノで幸せな時間を過ごそう!

    パチンコの遊び方と攻略 – 成功のための戦略を発見しよう!パチンコの遊び方をマスターしよう!プロのテクニックを習得して勝者に!パチンコの楽しさを体験しよう!成功のための戦略を発見しよう!戦略を鍛えてより高い勝率へ!

    ハッピー スターカジノで幸せな時間を過ごそう! - ハッピー スターカジノで幸せな時間を過ごそう!
    fooo
    fooo 2009/07/24
    グリッドデザイン支援ツール・アーカイブ
  • [CSS]印刷用のスタイルシートがグッとよくなる、3つのポイント

    既存の印刷用のスタイルシートや新規に作成する場合でも有用な、印刷用のスタイルシートの3つのTipsをLine25から紹介します。 Handy Tips for Creating a Print CSS Stylesheet 印刷時のテキストをデザインする 見出しやパラグラフ、リンクなどのテキスト箇所を印刷用にデザインします。 下記の例では、見出しを中央寄せにし、斜体にしています。 また、リンクのカラーをパラグラフと同じにし、下線を削除するのもよいでしょう(リンクのスタイルについては後述)。 <textarea name="code" class="css" cols="60" rows="5"> #header h1{ text-align: center; font-size: 42pt; font-style: italic; margin: 0; } #header h2{ text

    fooo
    fooo 2009/06/18
    印刷用CSSのポイント。page-break-before: always; で改ページ(ブログのコメントなどに利用)
  • [CSS]複数行のテキストを天地左右中央に配置するスタイルシート

    Vertically Center Multi-Lined Text demo デモでは、一行、複数行ともに中央に配置されています。 仕組みは、吹き出しに「display: table;」、その中のパラグラフに「display: table-cell;」を指定し、天地左右中央に配置します。 HTML <div class="area"> <div class="bubble"> <p>To look best, text should really be centered inside this bubble both vertically and horizontally.</p> </div> </div> CSS .area { width: 300px; height: 300px; background: url(../images/abe-bg.png) no-repeat;

    fooo
    fooo 2009/05/26
    IE7,8 対応済み
  • 画像置換でメニューを作る-CSS TIPS

    画像置換を使えばロールオーバーの実装を(javascriptを知らない)デザイナーでも簡単に実装することが可能になります。 ただし、複雑なメニューの場合、整理して書かないと後で大変なことになります。 今回は要点を説明しながらメニューを作って行きたいと思います。 ひとまず、完成系のサンプルに目を通しておいてください。 ベースとなる(X)HTMLソースは以下のようにします。 <ul> <li class="ajaBtn"><a href="/ajax/">Ajax</a></li> <li class="amaBtn"><a href="/amazon/">amazon</a></li> <li class="cssBtn"><a href="/css/">css</a></li> <li class="htmBtn"><a href="/html/">html</a></li> </ul>

    fooo
    fooo 2009/04/24
    css で画像置換 + マウスオーバー
  • CSSでmin-heightをクロスブラウザにする最も簡単な方法『Easiest cross-browser CSS min-height』 | CREAMU

    DiaryTechnology CSSでmin-heightをクロスブラウザにする最も簡単な方法『Easiest cross-browser CSS min-height』 CSSでmin-heightをブラウザに関係なく使いたい。 そんなあなたにおすすめなのが、『Easiest cross-browser CSS min-height』。CSSでmin-heightをクロスブラウザにする最も簡単な方法だ。 There are still enough folks using IE6, unfortunately, and it doesn’t support the min-height or min-width CSS parameters. This has caused the invention of a number of different hacks and browser

    fooo
    fooo 2009/03/04
    min-height, min-width をクロスブラウザで表示させる最も簡単な方法。非ハック
  • ブラウザのスタイルをリセットするスタイルシート集 | コリス

    <textarea name="code" class="css" cols="60" rows="5"> html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{ margin:0; padding:

    ブラウザのスタイルをリセットするスタイルシート集 | コリス
    fooo
    fooo 2008/11/17
    ブラウザスタイルをリセットするスタイルシートの一覧
  • [CSS]高さの異なるカラムを揃えるスタイルシート | コリス

    Columnas 100% altas Columnas 100% altasのエントリーでは、下記のデモのように高さの異なるdivで組んだカラムの高さを揃えるスタイルシートを紹介しています。 sample:高さがばらばらのdiv sample:高さが揃ったdiv スタイルシートは、各divに対して「padding-bottom」と「margin-bottom」に同じ数値をプラス値とマイナス値で指定を行い高さを揃え、それらのdiv要素を包んだdivで「overflow:hidden;」を指定します。 詳しくは、最小限にしたサンプルを作成したので参照ください。 高さの異なるカラムを揃えるスタイルシートのサンプル 下記の「32768px」って、何か特別な意味があるのでしょうか。

    fooo
    fooo 2008/10/31
    floatで並んだボックスの高さを揃える強引な技。32768pxはIEの処理能力の限界からきている?
  • CSSのOverflowを応用して画像を綺麗にリサイズ表示するサンプル:phpspot開発日誌

    Create Resizing Thumbnails Using Overflow Property | Css Globe This tutorial is aimed at controlling the size of the thumbnails appearing on your page. CSSのOverflowを応用して画像を綺麗にリサイズ表示するサンプル。 次のように、CSSで画像を固定サイズにトリミング表示できます。 更にマウスオーバーで画像を元サイズに。 実装について見ていきましょう マークアップが次のようにあったとします <p class="thumb"><a href="http://cssglobe.com/"><img src="image.jpg" /></a></p> そして、次のCSSを適用。 p.thumb{ float:left; margin:.5

    fooo
    fooo 2008/10/14
    cssだけで画像をトリミングしたように表示させる技
  • 今よりちょっとだけクオリティを上げるために。

    執筆が終わったと思えば、主業務が激務でネタがちらほら浮かんでたのに書けない今日この頃。 でも、どこぞのiPhoneネタと宣伝ばかりになってしまったブログよりいいかも知れません。えぇ。 さて、CSSってある程度覚えてしまえば思った以上に簡単に組めたりして、何となく組めている気がするって思ったりしないっすかね。 もしくは、その逆になーんかイマイチ成長してないようなって感じてる時とか。 そんな状況のときに、今よりちょっとだけコーディングのクオリティや効率を上げるのに意識する事とかやっておくべきこととかを思いつくままに上げてみます。 仕事としてってのがベースなので、個人サイトやブログレベルだと当てはまらないかも。 ボクが昔はやってなかったけど今は当たり前な事とか、今でも忘れがちな事とか、何かそういう感じのことを書いていくので、人によっては当たり前だし、ちょっとした発見がある人も居るかも? よく分か

    今よりちょっとだけクオリティを上げるために。
    fooo
    fooo 2008/09/22
    cssのレベルをより上げるためのチェック項目
  • Top 10 nhà cái uy tín nhất - Thưởng đăng ký giá trị

    Top 10+ Nhà Cái Uy Tín Nhất Hiện Nay [Cập Nhật Tháng 04/2026] Không thể phủ nhận rằng ngành cá cược trực tuyến đang ngày càng phát triển mạnh mẽ hơn bao giờ hết. Thế nhưng để chọn lựa được một nhà cái đáng tin cậy tham gia là điều không hề dễ dàng. Cập nhật danh sách những nhà cái tốt nhất thị trường hiện nay sau đây. Danh sách top 10 nhà cái uy tín được bình chọn và cập nhật mới nhất theo thời gi

    Top 10 nhà cái uy tín nhất - Thưởng đăng ký giá trị
    fooo
    fooo 2008/05/22
    「Silverback app」の仕組みの解説
  • CSS Nite公式サイト

    A collaborative AI workspace, built on your company context. Build and orchestrate agents right alongside your team's projects, meetings, and connected apps.

    CSS Nite公式サイト
    fooo
    fooo 2008/05/04
    cssだけでなく、ウェブ制作全体に関するセミナーイベント
  • [CSS]50+のクリエイティブなスタイルシートのチュートリアル | コリス

    noupeのエントリー「50+のクリエイティブなCSSのチュートリアル」から、CSSのテクニックをいくつか紹介します。 Using CSS to Do Anything: 50+ Creative Examples and Tutorials 先日、紹介した「チェックしておきたい50のCSSのテクニック」とは、別のものとなっています。

    fooo
    fooo 2008/04/23
    クリエイティブなcssのアーカイブ