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
ブラウザー上でサクッとコードの動作テストができるWebサイトいろいろ
2017年2月17日 便利ツール 作業中に、ふと動作確認がしたい…でも新規ファイルを作るのすらめんどくさい…なんてこと、ありませんか？（え？ない？w）そんな時はファイル不要！環境設定不要なオンラインテストサイトを使っちゃいましょう！動作確認用オンラインツールはいくつかありますが、実際に使っているもの、ブックマーク登録しているものをいくつか紹介します！ユーザー登録してコードを保存できるサイトもあるので、備忘録として使ってみてもよさそうです！ ↑私が10年以上利用している会計ソフト！ CodePen Webクリエイターボックスでも何度となく紹介してきたCodePen。フロントエンドの動作確認に最適です。Emmetの利用もOK！ライブプレビューができるので、いちいち保存したり実行ボタンをクリックして動作確認する必要はありません。作成したコードをブログへ埋め込んだり、シェアするのも簡単！ HTML
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SketchやPhotoshop、Gimpなどのファイルをブラウザで開いて編集できるオンラインフォトエディタ・「Photopea」
