[B! あとで読む][画像][css] mytechnoteのブックマーク

mytechnote id:mytechnote

あとで読むと画像とcssに関するmytechnoteのブックマーク (3)

[CSS]知っておくと便利！レスポンシブ用に画像を配置するスタイルシートの5つのテクニック
何らかの理由で画像をレスポンシブ対応にうまく配置できない時があるかもしれません。何時間もかけて、いろいろな実装方法を試すこともあるでしょう。 CSSハックは無しで、レスポンシブ用に画像のサイズ変更を処理して配置するスタイルシートの5つのテクニックを紹介します。 Time-saving CSS techniques to create responsive images by Adrien Zaganelli 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。画像に適した方法で実装しよう画像を配置するこれからのテクニック IEでも機能する、Netflixで使用されているテクニック簡単な方法パフォーマンスを考慮した方法（上級）レスポンシブ対応の画像を実装する時の流れ画像に適した方法で実装しよう今、金曜日の17時だとします。
mytechnote 2018/08/28
css

レスポンシブ

画像

便利

あとで読む
リンク
CSSスプライトとstepsを使ってアニメーション画像を作ろう
2023年7月25日 CSS CSSで動かすアニメーションには、私自身まだまだ使いこなせていないプロパティーがたくさん眠っています。その中のひとつが steps というプロパティーでした。これまでよく使っていた滑らかな動作ではなく、段階ごとに要素を動かすことができます。実際にはどんな場面で使えるんでしょうか？今回はそんな steps プロパティーにフォーカスしてみます。 ↑私が10年以上利用している会計ソフト！ steps の記述方法 steps は animation や keyframes プロパティーとともに利用します。steps() のカッコの中には、いくつの段階を経て動作させるのかを記述。例えば5段階で変化させるなら、steps(5) と記述します。 .element { animation: img-move 5s steps(5); } @keyframes img-move
mytechnote 2015/11/17
css

animation

CSSスプライト

css3

webデザイン

アニメーション

あとで読む

sprite

画像

web制作
リンク
1