Visual Studio 코드 CSS 들여 쓰기 및 서식

Visual Studio 코드 CSS 들여 쓰기 및 서식

---

단축키 ALT+ SHIFT+ F?를 사용하여 Visual Studio 코드에서 CSS 파일 자동 들여 쓰기를 활성화하는 방법이 있는지 알고 싶습니다 .

JavaScript에서는 잘 작동하지만 이상하게도 CSS에서는 작동하지 않습니다.

---

예, vscode-css-formatter 확장을 설치해보십시오 . 형식 .css파일에 기능을 추가하고 바로 가기는 동일하게 유지됩니다 Alt+Shift+F.

---

css / sass / scss / less를 아름답게

이것을 실행하려면

시작하다 alt+shift+f

또는

를 누르 F1거나 ctrl+shift+p다음 아름답게 입력 ..

---

다른 하나 -JS-CSS-HTML 포매터

이 확장은 모두 js-beautify를 내부적으로 사용한다고 생각합니다.

---

최상의 옵션을 찾기 위해 한 시간을 낭비했습니다.

쉽게 읽고 선택할 수 있도록 함께 모으십시오.

노트:

• CSS와 SASS / SCSS / LESS는 모두 관련이 있습니다.
• HTML, Javascript, Typescript, JSON-VS 코드는 이미 형식을 지정하고 있습니다.
• CSS 및 관련-VS 코드는 현재 형식 이 아닙니다.

옵션 :

• css / sass / scss / less를 포맷하려면 :
  • https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
    • 모든 CSS 관련이 지원되고 다른 것은 아닙니다. 이것을 선택하면 훌륭하게 작동합니다.
• JavaScript / TypeScript / CSS를 포맷하려면 :
  • https://marketplace.visualstudio.com/items?itemName=michelemelluso.code-beautifier
    • 그러나 이미 JS, TS는 VS 코드에서 지원됩니다.
• JS, CSS, HTML, JSON 파일 형식 지정 (js-beautify 래핑)
  • https://marketplace.visualstudio.com/items?itemName=lonefy.vscode-JS-CSS-HTML-formatter
    • 그러나 이미 JS, HTML, JSON은 VS 코드에서 지원됩니다.
• CSS 형식을 지정하려면
  • https://marketplace.visualstudio.com/items?itemName=aeschli.vscode-css-formatter
    • 그러나 CSS 만 지원하고 모든 관련 항목은 지원하지 않음-6 개월 이상 유지되지 않음

포맷하려면 :

예를 들어 Prettier를 설치 한 후 VS Code에서 Alt + Shift + F를 누릅니다.

도움이 되었기를 바랍니다.

---

Visual Studio 코드에서 로컬 bootstrap.min.css 를 연 후 들여 쓰기가없는 것처럼 보였습니다. commad ALT + Shift + F를 시도 했지만 헛된 것입니다.

그런 다음 설치

CSS Formatter 확장.

다시로드하고 ALT + Shift + F가 내 CSS 파일을 매력으로 들여 쓰기했습니다.

빙고 !!!

---

There are several to pick from in the gallery but the one I'm using, which offers considerable level of configurability still remaining unobtrusive to the rest of the settings is Beautify by Michele Melluso. It works on both CSS and SCSS and lets you indent 3 spaces keeping the rest of the code at 2 spaces, which is nice.

You can snatch it from GitHub and adapt it yourself, should you feel like it too.

---

I recommend using Prettier as it's very extensible but still works perfectly out of the box:

1. CMD + Shift + P -> Format Document

or

1. Select the text you want to Prettify
2. CMD + Shift + P -> Format Selection

---

Go to Files menu -> Preference -> Extentions Then type CSS Formatter wait for it to load and click install

---

HookyQR.beautify 확장을 설치합니다. Visual Studio Code에서 javascript, JSON, CSS, Sass 및 HTML을 아름답게 만듭니다. 이 목적을 위해 가장 많이 사용되는 확장입니다.

---

원할 때 Visual Studio에서 코드 서식을 지정하려면 (Ctrl + K) & (Ctrl + F)를 누릅니다.

자동 서식 규칙은 도구 / 옵션-> (왼쪽 사이드 바) : 텍스트 편집기 / CSS (또는 변경하려는 다른 언어)에서 찾아서 변경할 수 있습니다.

CSS 언어의 경우 옵션은 안타깝게도 매우 제한적입니다. ... / 텍스트 편집기 / 모든 언어에서 몇 가지를 변경할 수도 있습니다.

참고 URL : https://stackoverflow.com/questions/37739375/visual-studio-code-css-indentation-and-formatting