Elementsパネルで編集したCSSをそのままファイルに保存する（ひとり DevTools Advent Calendar 2020 – 12日目） | Ginpen.com
12 日目の記事です。 DevToolsおれおれAdvent Calendar 2020やります。ひとりで。 スタイルの微調整って Elements パネルでやるじゃないですか。数字変えたり色変えたり。あるいはレイアウト崩れたときに Elements パネルであっちこっちいじりながらデバッグしたりとかも。で、あれこれ変えてよし完璧ってなって、はてどこを変更したっけなと。そういう経験は皆さんおありだと思います。あるよね？ Chrome DevTools でローカルのフォルダーを開いておくと、localhost での変更をそのままファイルに反映、つまり Elements パネルで調整した CSS を保存することができます。 【書いた】DevToolsをIDE化するやつです / Elementsパネルで編集したCSSをそのままファイルに保存する（ひとり DevTools Advent Calen
Adobe Creative Cloud アセットでPSD画像をスライスし、テキストのCSS情報を取得しよう | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Adobe Creative Cloud アセットでPSD画像をスライスし、テキストのCSS情報を取得しよう こんにちは。まろCです。 雪がふりました。積もりはしませんでしたが。 そうですね、何かに例えるなら、白雪姫でした。 コーディングするとき、一番と言っていいほど時間がかかる箇所があります。それはPSDデータとのにらめっこです。 Fireworks派だった僕はLIGに入社して初めてPhotohopを触っているのですが、画像を切り出したり、テキストのサイズや行間を見て要素間のマージンを測ったりと、作業がいちいち面倒で時間がかかっていました。 しかし、なんと体感で6000倍ぐらい効率化してくれるWebツールがAdobeにあったのです。それがCreative Cloud アセットです Creative Cloud アセットとは https://assets.adobe.com/ ひとことで言
ウェブ制作のフローが劇的に変わる！『Avocode』ベータ版を使ってみました | コリス
PNG Hat, CSS Hatなど、ウェブ制作に役立つツールを数多く開発しているMadeBySourceから、更に強力なツール『Avocode』がリリースされます！ 正式版のリリースはまだ先ですが、中の人からプライベートベータ版をいただいたので、さっそくそのレビューをお届けします。 プロダクトキーは複数あるので、レビューを見て興味をもっていただいた方は、明日か明後日に募集するのでお楽しみに。 Avocode Avocodeは簡単に言うと、PSDのプレビューと書き出しをPhotoshop無しで行うもので、書き出しは.png, .jpgの画像だけでなく、SVGへの書き出し、CSSへの書き出しにも対応しています。 画像のスライスやスタイルシートのコーディング作業を大幅に強化する感じです。 僕もまだ使って間もないのですが、Avocodeの画面を見ながらレビューします。 と、その前に、動画がアップ
利用中のテーマやプラグインのCSS編集と保存がその場で出来るWordPressプラグイン・WP Live CSS Editor
WordPressを使ったWebサイトで現在利用中の テーマやプラグインのCSSをその場で編集、 保存を可能にするWordPressプラグインの ご紹介。多用するものではありませんが、 開発中とかに使っても便利かも、と思った のでメモがてら。 何度か似たようなものもありますけど多くは無いので選択肢の一つとして。Webサイトを見ながらその場で利用中のテーマやプラグインのCSSを編集、保存できるプラグインです。ローカル環境で開発の手助けにもなるかな、とか思ったりしましたよ。 これ便利ですねー。機能はシンプルで、Webサイトの右側にボタンが出るので、クリックするとエディターが開きます。あとは修正して保存すればいいだけ。 編集中はインタラクティブに反映されますのでサイズの指定ミスなんかをするとエディタも場外にすっ飛ばされて編集できなくなっちゃうので気をつけてください。微調整向けですかねー。 編集し
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
