タグ

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

タグの絞り込みを解除

cssとimageに関するthleapのブックマーク (5)

  • srcsetとsizes

    パート1:メディア・クエリのどこがまずいのか? そう、もし君がウェブサイトを作っている時代が1993年2月23日から2010年5月25日の間だったら、画像の扱いなんてチョロかったね! それはこんなふうに単純だった。 幅の固定されたレイアウトをにらみつける 画像がきっかり何ピクセルかを測る――その画像はあらゆるユーザーの画面で変わらないスペースを占めることになる Photoshopのエンジンをかける 画像をさっき測ったとおりのサイズで「ウェブ用に保存」する それを<img>タグでマークアップする グラスにビールを注ぎ(または新鮮なグリンピースの缶を開け)、仕事がうまくいったことを祝う ときおり聡明なる預言者が荒野から現れては、この手法に潜む問題について深遠な真実を説くこともあった。それでもこのやり方は、20年もの間、ウェブ・デザイナーを生業とするものたちに受け入れられてきた。 しかし、時代は

  • Image Tint With CSS

    By Louis Lazaris / November 16, 2011 / 46 Comments Updated: August 7, 2022 Update: (May 7, 2013) There are now two specifications that make this sort of thing possible with CSS: Filters and Compositing and Blending. The other day Paul Irish posted an article that collected together responses to a question that he and Yehuda Katz asked their Twitter followers. One of the wish list items a few peopl

    Image Tint With CSS
  • Recently I worked with Art Processors to create... - German for black

    You’re about to read articles on the subject of building for the web by Ben Schwarz. Recently I worked with Art Processors to create the “Replay” feature for The State Library of New South Wales’ “Curio” — Essentially, you get to see which exhibits you viewed at the gallery after you’ve left (you’re geotagged through the building as you explore). One particular part of this build proved difficult,

    Recently I worked with Art Processors to create... - German for black
  • CSS内の画像埋込で高速化(Data URI) - Qiita

    スタイルシートの中で画像を多数呼出していると、HTTPリクエストが大量発生してページの読み込みが遅くなります。このような場合、CSS Spriteを使って回避することが一般的ですが、Data URIを使うと運用はもっと簡単です。 CSSファイルへの埋込 例えばOSSCafeの場合、サイトのCSS内で16ほどの画像ファイルを読込んでいます。 body { background-image:url(images/body.png) } body>header { background-image: url(images/header.png) } body>header div.center>h1 { background-image:url(images/logo.png) } ...(略) body { background-image:url(data:image/png;base64,

    CSS内の画像埋込で高速化(Data URI) - Qiita
  • Data URIs | CSS-Tricks

    DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! Did you know that you don’t have to link to an external image file when using an <img> element in HTML, or declaring a background-image in CSS? You can embed the image data directly into the document with data URIs. (It’s equally correct to say “Data URL”, which I think I prefer.) With CSS,

    Data URIs | CSS-Tricks
  • 1