タグ

関連タグで絞り込む (7)

タグの絞り込みを解除

cssに関するknzm_imgのブックマーク (14)

  • Xlune::Blog


    可変グリッドレイアウトjQueryプラグイン(jquery.vgrid.js) なんだか可変グリッドレイアウトがまた流行ってる︵？︶ようなので、jQueryプラグイン書いてみた。 一通りブラウザで表示確認ぐらいはしたけど、テストは十分じゃありません。Demo Demo Index 利用方法はデモのソースを確認してください。(ウィンドウリサイズして動きも確認してね) Download github zip file 利用には、jQuery本体とjquery.easingプラグインが必要です。別途読み込んでください。 更新情報 v0.1.8 (20120421) display属性で、グリッド要素の表示/非表示を切り替えれるように修正しました。demo009を追加 v0.1.7 (20111110) 複数の可変ボックスを指定すると、開始位置がおかしくなるバグを修正しました。demo008
    Xlune::Blog

  • IE7 でposition: absolute な要素に対する z-index が正しく理解してもらえない - The Second Longest Day in My Life...

    IE7には position:absolute な要素の z-index 表示に問題があり、以下のような場合に #lower が #upper にかぶってしまう。 <div id="upper_container"> <div id="upper"> これは上に表示されます </div> </div> <div id="lower_container"> <div id="lower"> これは下に表示されます </div> </div> #upper_container { position: relative; } #upper { position: absolute; z-index: 10; } #lower_container { position: relative; } #lower { position: absolute; z-index: 5; } そんなときは、re

    IE7 でposition: absolute な要素に対する z-index が正しく理解してもらえない - The Second Longest Day in My Life...

  • 【レビュー】HTMLのidとclassでいい名前をつけるテクニック | エンタープライズ | マイコミジャーナル


    SitePoint: New Articles, Fresh Thinking for Web Developers and Designers HTMLを書く際に悩むことは多々あるが、中でも悩ましいことのひとつにidやclassで指定する﹁名前﹂がある。idやclass属性はCSSやJavaScriptで対象となる要素を特定するために使われる。わかりやすく一貫性がある名前をつけることは、WebプログラマやWebデザイナにとって欠かすことができないスキルであり、悩ましいところでもある。 How To Compose HTML ID and Class Names like a RockstarにおいてMeitar Moscovitz氏がidやclassの名前をつけるひとつの方法を紹介している。短くまとまっており参考になる。同記事では次のテクニックが紹介されている。まず、名前を考える段階で次

  • cssの情報・まとめ


    cssの情報まとめです。ローカル 環境にストックしていた情報を 開放してみますのでシェアして 頂ければ幸いです。内容は 結構偏っていると思いますので 参考程度になさってください。 全てのcss情報が有るわけではありません。主観でストックしていたリンク集です。ツールとかメニュー関連とかハックとかいろいろ188の情報です。 ツールオンラインのcssツール。 CSS Validation Service / W3C検証サービス日本語版RoundedCornr / 角丸のHTML・CSSコードを生成してくれるCSS Type Set / ファミリー、色、単語間、行間等をプレビューで確認CSS Text Wrapper / 様々な形のテキストの回りこみを簡単に実現できるCSS Builder / オンラインでスタイルを生成可能Spiffy Box / cssによる角丸を簡単に生成The Box Of
    cssの情報・まとめ

  • トロ〜ンとしたNの日常: IE7でサブメニューの表示が崩れる（mm_menu.js)


    Dreamweaver 8のビヘイビアで、サブメニューを表示させる︵たとえばこちらのページのメーカー名にマウスを移動させると表示するメニュー︶設定を行うと、なぜかInternet Explorer7ではレイアウトが崩れて、最初の1文字目だけが表示されるという現象に陥っていました。 これを解消させる方法が、こちらのCre8asite Forumというところに書かれていました。現象は若干違う︵この質問者は英語圏の方で、半角スペースを入れるとそこで改行されてしまうという現象の解決法でした︶のですが、対処方法は同じでOKです。 対処方法は、サブメニューの設定をしたときに生成されるmm_menu.jsというファイルの一部分を修正するというものです。 function writeMenus(container) { .... some codes here .... menu.menuItemHeig

  • CSSの実装状況で変わるボックスのデザイン方法


    Web制作において、対応しなくてはいけないブラウザの中には、未だしぶとくIE6が残っています。IE6が2001年に登場したことを考えると、もう8年もその時代の﹁縛り﹂を(健気に)守りながら作っていることになるんですね。 いま良く使われているCSSのテクニックも、ほとんどはこの﹁縛り﹂の範囲内で有効な手法なわけですから、突然2001年にタイムスリップしてサイトを作る事になったとしても、今も昔も変わらない1つの古文書に従えばいいので、きっと活躍できます。 しかしたまらん、流石に疲れた。 ボックスひとつができること CSSでは、文書を構成する各要素は、ボックスという矩形領域に置きかえられ、それらの持つプロパティを操作して装飾します。つまり、ボックスはページデザインを構成する最小単位と言えるわけですね。 そこで今回は、最小単位となる1つのボックスに対して、どのような装飾手法が有効かという点を、CS
    knzm_img
    knzm_img 2009/08/03
    リンク

  • 「Yahoo!ニュース」の表示速度が3～5倍に、そのからくりは……：記事の芽

    Windowsの大迷惑を斬る Windowsの設定変更、項目を効率的に探すなら「設定」「コントロールパネル」の順で 2024.03.06

    「Yahoo!ニュース」の表示速度が3～5倍に、そのからくりは……：記事の芽

  • リロード、スクロールで線・画像が消える。通称「いないいないばあバグ」 | Igaloglog


    IE6のバグで通称﹁いないいないばあバグ﹂というものがあります。日本語訳しない状態で﹁peek-a-boo bug﹂。 リロードしたり、スクロールしたりすると、CSSで指定したborderやbackgrund-imageが出たり消えたりする、というバグです。 というか、基本状態で表示されていなくて、リロード、スクロールで出たり消えたりする、のほうが正しいんでしょうか。 ﹁いないいないばあバグ﹂とは言いえて妙の、訳の分からんバグです。こういうの誰が命名したんでしょうね。 いないいないばあバグの対処法としては、 問題の出る要素を囲っている div に line-height を指定する。 問題の出る要素に width または height を指定する。 問題の出る要素の中の要素に position:relative を指定する。 の3つの方法があるようです。他にもあるかもしれませんが、と
    knzm_img
    knzm_img 2009/05/20
    リンク

  • IE6でよく遭遇するCSSのバグとその解決方法 | コリス


    Dave Woodsのエントリー﹁IE6 -CSSのバグとその解決方法﹂から、IE6でよく遭遇する3つのCSSのバグとその解決方法の意訳です。 IE6 - CSS Bugs and Fixes Explained IE6で、マージンが2倍になってしまうバグ IE6で、hasLayoutプロパティによって起こるバグ IE6で、小さい高さを指定した場合に起こるバグ IE6で、マージンが2倍になってしまうバグ IE6で、フロートした要素のマージンが2倍になってしまうバグと解決方法の紹介です。 下記のコードで、IE6はマージンが20pxになります。 sample:バグ #navigation{ float: left; width: 200px; margin-left: 10px; } #content{ float: right; width: 500px; margin-right: 10p
    IE6でよく遭遇するCSSのバグとその解決方法 | コリス
    knzm_img
    knzm_img 2009/03/25
    リンク

  • CSSでmin-heightをクロスブラウザにする最も簡単な方法『Easiest cross-browser CSS min-height』 | CREAMU


    DiaryTechnologyCSSで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 itdoesn’t support the min-height or min-width CSS parameters. This has caused the invention of a number of different hacks and browser
    knzm_img
    knzm_img 2009/03/19
    リンク

  • 「サイトの横幅」再論：950px時代のウェブデザイン［絵文録ことのは］2009/01/14

    以前、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論［絵文録ことのは］2006/11/25で、「実際にサイトを閲覧している人のブラウザーの横幅と、ブラウザーによる印刷上の制約から、特に画像は左端から640ピクセルくらいに収まるようにした方がよさそうだ」という結論に落ち着いた。これには、一行字数が多すぎると読みづらい、という、紙媒体の扱いも多いわたしの経験的な見方もある。 もちろん、これにはリキッドデザイン主義者の方から「ページ幅を指定するようなデザインであること自体が悪」という反応があったり、「印刷用CSSを使おう」といった反応があったりしたのだが、「印刷時のことを考えれば640pxという制約がある」という結論は特に揺るがなかった。 その後、今まで約2年経った。閲覧者の環境も変わり、当時主流だったIE6にはなかった「用紙サイズに合わせて印刷」機能を備えたIE7ユーザーも増

    knzm_img
    knzm_img 2009/02/13
    メジャーサイトの横幅について
    リンク

  • SCRUFA4 เว็บแทงบอล ยอดนิยมอันดับหนึ่ง เว็บตรง UFABET ✅✅

    UFABET เว็บพนันออนไลน์ อันดับ 1 บริการ แบบครบวงจร ตลอด 24 ชั่วโมง UFABET เป็น เว็บไซต์พนันออนไลน์ อันดับ 1 ของประเทศไทย และเอเชีย ที่ได้รับการยกย่อง เรื่องการบริการ และความมั่นคง ทางการเงินอย่างสูง UFABET ฝากถอน ไม่มีขั้นต่ำ เนื่องจากเราใส่ใจ คุณภาพในด้านการบริการ และประสิทธิภาพ ของเว็บไซต์ อย่างมาก ทำให้มีสมาชิก จำนวนมากให้ความเชื่อถือ กับเราและเพิ่มขึ้นอย่างต่อเนื่อง เราเป็นเว็บพนันออนไลน์ ที่บร

    knzm_img
    knzm_img 2008/11/19
    リンク

  • IE6で、文字(画像)が複製されてズレる - Archiva


    Make a noteofit: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 IE6の表示バグです。とあるショップサイトを構築してる時に、たまたま出会いました。かなり久しぶり。 ↑が正常な表示。Opera/Firefox等はこれです。これがIE6だと... こうなる。初見では﹁継承か？ marginの重複か？﹂とか思うズレですが、試しに選択してみると、問題が解りやすくなります。 なんか妙な要素が出現してますね。それに押された感じ。試しにテキストにしてみると... なんか複製されてます。さ～どうするか。 解説 実はこれ、﹁Explorer 6 Duplicate Characters Bug﹂という長ったらしい名前でそこそこ有名なバグで、複数のf
    knzm_img
    knzm_img 2008/03/25
    リンク

  • [CSS]divもfloatもclearもhackも使用しないで組む3カラムレイアウト | コリス


    TJK Designのエントリーから、ヘッダ・フッタ・3カラムのレイアウトをdiv, float, clear, CSS hackを使用しないで実装するスタイルシートの紹介です。ACSS layout that does not rely on DIV, FLOAT, CLEAR nor structural HACK! 対応ブラウザは、WidnowsがIE5.01, 5.5, 6, 7, Fx0.8, 1.5, 2.0, Op9.0, 9.24、MacがIE5.2, Safari2.0, 3.0, Fx2.0、LinuxがKonqueror, Mozilla、そしてiPhoneとなっています。 仕組みは、簡単に説明するとリストを使用したもので、実装方法は8つのステップで紹介されています。
    knzm_img
    knzm_img 2008/03/06
    な・・・何のために？
    リンク
  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.