サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
ドラクエ3
cruw.co.jp
公式ツールのcwebp/dwebpをインストールcwebp/dwebpは直接公式サイトからダウンロードする方法もありますが、Macを使っている方なら以下の方法で簡単にインストールできます。 brew install webpインストールが完了したらバージョン確認してみてください。 cwebp -versionバージョンが表示されれば、インストール完了です。 cwebp/dwebpの使い方cwebpとdwebpの使い方も簡単にご紹介します。 WebP形式からPNG形式に変換する場合はdwebpを使います。使い方は以下になります。 dwebp image.webp -o image.pngdwebp [WebP形式ファイル指定] -o [変換後のPNG形式 or PPM形式ファイル名] PNG、JPG形式をWebP形式に変換する場合はcwebpを使います。以下の方法で使います。 cwebp i
最近、徐々に注目を浴びているCSSのグリッドレイアウトモジュール「display:grid;」について調べてみました。 結論から述べると、とても素晴らしい技術で、Bootstrapとかいらなくなるかもしれないなと感じました。 CSSグリッド対応ブラウザまずいちばん気になるのが対応ブラウザ。対応していないブラウザがあると、それだけでそもそも導入できなくなる。 現在（2018年7月 現在）、対応状況は以下のようになります。 IE11（一部対応）EdgeFirefoxChromeSafariiOS SafariChrome for Android等 IE11が完全対応していないのが気になります。。（マジかよIE） でも、対応していないブラウザは時間の問題で解決されるので一旦放置します。 現状は完全導入はちょっと注意が必要になりますね。 そもそもCSSグリッドレイアウトモジュールってどんなの？簡単
文字にぼかしを掛けて読めなくしたい。画像にぼかしを掛けて背景にしたい。Photoshopで画像にして処理すれば簡単にできますが、いちいち作るのが手間。CSSでもっと簡単にできないの？という方に今回、CSSでできるコンテンツや背景のぼかし方をご紹介します。 クラス付与だけでコンテンツをぼかす方法ぼかすだけならとてもシンプルです。以下のようなクラスを定義し、ぼかしたいコンテンツにクラスを付与するだけで完了です。 .blur{ -ms-filter: blur(6px); filter: blur(6px); }実際にぼかしを掛けたのが以下になります。左が普通のコンテンツ、右がblurクラスを付与したコンテンツです。 背景だけをぼかしかける方法背景のぼかしは擬似要素beforeをしようすることで掛けることができます。以下、ソースになります。 .blurBg{ background: url(画像
基準値(Base)を入力し、左のテキストエリアにCSSをまるっと入力して下さい。 入力後すぐさま基準値を元にpxからvx計算し右側にvw変換後のCSSを出力します。 ※ 尚、「border: 1px solid #000;」や「transform: translateY(10px)」等には対応していませんのでご了承下さい ↑少しクリックが増えてきて満足(^^)目指せ100いいね！ ご要望を受け、こっそりcalc(のみ)にも対応しました！
このページを最初にブックマークしてみませんか？
『株式会社Cruw｜長野県上田市のWeb制作会社』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
