Web制作の面倒な作業をラクにするCSS便利ツール87個まとめ
この記事では、Webデザイン制作の面倒な作業をラクにするCSS便利ツール87個をまとめています。なお、新しいツールを随時アップデートしています。 CSS FlexboxやGridをつかったレイアウト生成ツールや、レスポンシブ対応の画像ツール、配色に困ったときに便利なツール、多彩なCSSアニメーション、話題のニューモーフィズムなど、CSSスタイリング時間節約や、さまざまな問題を瞬時に解決することを目的に作成された便利なツールが揃います。 Web制作に活用したい最新ツールと合わせてチェックしてみてはいかがでしょう。 これだけあれば困らない！Web制作を快適にする最新オンラインツール48個まとめ Web制作�の面倒�な作業をラクにするCSS便利ツールまとめ CSS box-shadow Examples さまざまなサイトで実際に使われているCSS box-shadowを集めているライブラリ。お好
自由な形に画像の切り抜きができるSVGのclip-path polygonを CSSで行う | 9ineBB
CSSで画像の切り抜きをする SVG の ClipPath で polygon というものがあり 3点以上の座標をX点とY点で指定することで、その領域を切り抜くことが出来ます 画像編集ソフトでクリッピングするようなものです これを CSS で行うことが出来ます img要素やdiv要素に適応出来て画像をそのまま切り抜きが出来ます 使うのは clip-path: polygon(); polygon() のなかに座標を入れていきます 座標はpxで指定 -webkit-clip-path: polygon(103px 17px,235px 81px,214px 287px,28px 246px,26px 63px); 座標は％での指定でも可能です それぞれの座標は XとYはスペースで区切り カンマで一つの座標を区切ります DEMO (Chrome、operaでのみ動作確認してます) clip-p
WebサイトでSVGを使ってみる｜デロイト トーマツ ウェブサービス株式会社（DWS）公式ブログ
Webの世界は日々変化を遂げ、制作者は様々な問題に遭遇します。 近年、モバイル技術の進歩により、Webが閲覧できるデバイスが増え、それがさらに制作者の悩みを増大させています。 その中の１つが、イメージファイルの問題ではないでしょうか。 イメージファイルを扱う際の問題点が増えてきた これまでよく使われていたラスター形式のファイル（GIF,PNG,JPEG）は、PCのみを対象としたWebサイト制作においては、さほど問題になることがありませんでしたが、サイトを閲覧するデバイスが増えるに従って、様々な問題が出てきました。 サイズを変えると荒れてしまうため、使うサイズごとにファイルを作らなくてはならない。 Retinaディスプレイや4Kディスプレイなどの高密度モニターで見た場合も、荒く見えてしまうため、縦横2倍のピクセルサイズのファイルを用意するなど、デバイスの差異に対する配慮が必要となってきた。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
こいつ動くぞ！商用利用無料、シンプルにデザインされたフォントもSVGも揃ったフリーのアイコン素材 -Box Icons
http://handywebdesign.net/2017/10/beautiful-svg-animation/
