タグ

2013年9月18日のブックマーク (6件)

  • inline-blockで発生する隙間(空白)を消す方法 - ナオユネット

    display:inline-blockで発生する謎のスペース imgタグを横並びにしようとすると謎のスペースが出来ます。 display:inline-blockでも同じような空白ができますね。 この隙間は、コードの上での改行が空白として認識してしまっているからなんですね。 HTMLはこんなソースになってませんか? <img src="hoge1.jpg" alt="" /> <img src="hoge2.jpg" alt="" /> <img src="hoge3.jpg" alt="" /> <div class="box">aaaaaaa</div> <div class="box">aaaaaaa</div> <div class="box">aaaaaaa</div> ふつう、こうやってタグ毎に改行して見やすく記述しますよね。 それでは、.boxにはinline-blockを

    inline-blockで発生する隙間(空白)を消す方法 - ナオユネット
  • CSS(スタイルシート)の基本、小技、テクニック総まとめ

    CSSの基や使える小技テクニックなどを幅広くまとめました。以前書いて今もそこそこアクセスがある「CSSの知識をもっと深める30+2の小技テクニック集|Webpark」という記事があるのですが、2年近く前の記事ですしパワーアップさせて作り直しました。 恐らく過去最長の記事ですので目次を作りました。クリックするとするりと移動します。基的な内容が多いですが、お役に立つ項目があればうれしいです。 ということで順番に説明していきます。 1. 全般的なこと 1-1. CSSリセット ブラウザごとでデフォルトのスタイルは異なっています。その違いをそのままにしておくと、後でブラウザ間の表示の違いに悩むことになり、どこが原因か分からないとイライラしてしまいます。 そんなことのないように、いったんデフォルトのスタイルをリセットしてしまおうというのがリセットCSSです。 方法は色々ありますが、個人的には一番

    CSS(スタイルシート)の基本、小技、テクニック総まとめ
  • 私がよく使っているWebサイト作成に役立つブックマークレット

    ユーザーがウェブブラウザのお気に入りなどに設置されたブックマークレットをクリックすると、ブックマークレットに記述されたJavaScriptの小さなプログラムが、ウェブブラウザで起動する。プログラムはページの外観や表示を変更したり、他の場所にジャンプしたり、子ウィンドウを表示したり、ウェブブラウザで表示中のウェブサイトのURLを取得したり、ユーザーに追加情報の入力を促したりする。 - Wikipediaより ということで、プログラムを起動するボタンとしてブックマークを使う感じです。では、私が普段から使っているお勧めブックマークレットを紹介します。 XRAY クリックした要素の内容を表示してくれます。topやleftなどの位置関係、width、height、margin、paddingなどのボックスに関することなどが一目で分かります。 ColrGrabr そのサイトにどのような色が使われている

    私がよく使っているWebサイト作成に役立つブックマークレット
  • Best Photo Editing Freebie|Freebies for Photographers and Designers

    Just beginning a photography business or want to enhance your photo editing workflow? FixThePhoto shares thousands of photo editing freebies to boost your productivity and make your work more creative. Photography is a nice hobby, but if you treat it seriously and aren’t just taking photos with your smartphone, it turns out to be really expensive. Just imagine all the lenses, tripods, cameras, and

  • 18 Best jQuery Carousel Plugins | Code Geekz

  • ページ内リンクをスマートにするsmoothScroll.js[to-R]

    ページ内リンクをスマートにするsmoothScroll.js ページ内リンクをスムーズに行うjsライブラリ、smoothScroll.jsを作成したので公開します。 どういったものかはサンプルで確認してください。 <a href="#header">ページの先頭に戻る</a> などのページ内リンクをスムーズな移動に変更します。 これにより、エンドユーザーがページが遷移したという錯覚におちいることはありません。 設置方法は簡単です。 smoothScroll.jsをダウンロードして、設置したいページで取りこみます。 <script type="text/javascript" src="./smoothScroll.js"></script> 特定のリンクはスムーズさせない smoothScroll.jsは#(ハッシュ)付きのリンクを全てスムーズスクリプトに変換します。他のライブラリなどで#

    ページ内リンクをスマートにするsmoothScroll.js[to-R]