使えるHTML/CSS、そのほか自分用備忘録的メモ

 

HTML　Tips

data-textで補足テキスト表示

お役立ちサイト

data属性を利用したナビゲーションの実装サンプル｜Nx-World
CSSのコンテントプロパティーを使いこなそう｜Webクリエイターボックス

<p data-label="hoge">

とし、cssで要素のbeforeやafterを設定して、content:attr(data-label);でdata-labelの中身を出力することもできる。

CSS　Tips

ratinaディスプレイの画像差し替え

CSSによるbackground表示か、html挿入画像かで違う何パターンかの方法
Webサイト＆WebアプリのRetina対応方法まとめ｜KRAY

Adobeソフトチュートリアル

シネマグラフ（シネグラフ）の作り方

動く写真 一 シネマグラフの作り方｜Adobeサポート

●↓無料動画素材の紹介も。
Photoshopをつかったシネマグラフの作り方