私は Web 開発者/デザイナーですが、コードに詳しくないクライアントが、特定の要素の色を簡単にいじったり、これらの CSS の変更を保存したり、送信したりできるようにする必要があります。私は電話で彼らを案内しますが、テーマ シートで CSS セレクターを見つけて 16 進コードを書くことを期待するよりも簡単にする必要があります。
コードに詳しくない個人が次のことを行えるようにするブラウザー内インスペクターが必要です。
- GUI カラー ピッカーを使用して、Web ページの要素の色を簡単に操作できます。
(+) Chrome はこれを完璧に行います。それはまさに私が欲しいものです。
(-) Firefox の華麗なインスペクタには、この基本的な機能がないようです。 - 影響を受けたスタイルシートを保存して、私に送ってください。
(?) Firefox の Style Editor を使用すると、シートを簡単に保存できますが、検査された要素への変更が - 不思議なことに - 適用されないようです。
(-) Chrome はおそらくソース パネルの奥深くでこれを行うことができるかもしれませんが、それを理解するにはハッカーになる必要があるようです。アウト。
この難問の存在は非常に不可解だと思います.なぜブラウザベンダーは、CSS を操作できるが、基本的な「変更を保存する」機能を含まないようなリッチな Web ページ編集スイートをわざわざ作成したのでしょうか? 何か不足していますか？
編集 01:
Chrome では、要素の CSS をインスペクタで自由に操作できることがわかりました。次に、各ルールに関連付けられた CSS シート (ルールの右上隅) をクリックして、ソースタブ。これは私が保存したいものです。
ここから、この変更されたソース コードの任意の場所を右クリックし、[名前を付けて保存] を実行できますが、奇妙なことに、残念なことに、直感に反して、 Chrome は間違ったソース コードを保存します。元の変更されていないソース コードが保存されます。右クリックして名前を付けて保存した変更されたソース コードではありません。非常にイライラするので、現在、このバグを回避する方法を見つけようとしています。私はとても近いです！
編集 02:
さて、私はそれを理解しました。Chrome の [ソース] タブでファイルを保存するときは、そのファイルを保存するだけではありません。実際には、ファイルに変更を加えるたびに常にそのファイルを自動保存するように Chrome を設定していることになります。
これは実際にはクールですが、非常に誤解を招きます。
したがって、CSS ファイルを保存した後、インスペクターで要素の CSS に加えたすべての変更は、そのファイルに自動保存されます。これは、ブラウザを再起動しても持続します。
自動保存用にマークされたファイルがあり、変更されたファイルを名前を付けて保存すると、 Chrome は右クリックしたファイルではなく元のファイルを奇妙に書き込むため、混乱が生じました。その後変更を加えるとすぐに、Chrome は現在のすべての変更をそのファイルに自動書き込みします。これはChromeのバグだと思います。
教訓を学び ましょう。まず、ファイルに名前を付けて保存します。次に、変更を加えます。
さきほど、変更した CSS テーマがハードディスクで待機しています。
明確にするために、保存してから変更を加えてから再度保存すると、Chrome は変更されたソースではなく元のソースを保存します。これにより、物事の順序が重要になります。
自動保存用に現在マークされているファイルのリストを表示する方法や、マークを解除する方法がわかりません。