Chrome DevTools复制元素CSS样式输出变为多行,如何设置恢复为单行模式?
How to Restore Single-Line CSS Style Copying in Chrome DevTools
Absolutely! I’ve run into this exact issue after a Chrome update too—luckily there’s a simple setting to switch back to single-line CSS copies. Here’s what you need to do:
- Open Chrome DevTools (use the shortcut
F12orCtrl+Shift+Ion Windows/Linux,Cmd+Opt+Ion Mac). - Click the gear icon ⚙️ in the top-right corner to open DevTools Settings.
- Go to the Preferences tab (it’s usually the first one loaded).
- Scroll down to the Elements section—look for the checkbox labeled "Copy styles as single line".
- Check that box, then close the Settings panel.
From now on, when you right-click an element in the Elements panel and select Copy > Copy styles (or use the corresponding shortcut), the CSS will be copied as a single line instead of being split across multiple lines. If you ever want to go back to the multi-line format later, just uncheck that same box.
内容的提问来源于stack exchange,提问作者Tompina




