>  기사  >  개발 도구  >  Webstorm에서 새 CSS 파일을 만드는 방법

Webstorm에서 새 CSS 파일을 만드는 방법

下次还敢
下次还敢원래의
2024-04-08 16:00:26854검색

WebStorm에서 새 CSS 파일을 생성하려면: 프로젝트 구조를 열고 대상 폴더에서 "새로 만들기" > "CSS 파일"을 마우스 오른쪽 버튼으로 클릭합니다. 파일 이름을 입력하고 미리 설정된 템플릿, 인코딩, 파일 제목 포함 여부를 선택한 후 "만들기"를 클릭하세요.

Webstorm에서 새 CSS 파일을 만드는 방법

WebStorm에서 새 CSS 파일을 만드는 방법

새 CSS 파일을 만드는 단계:

  1. WebStorm을 열고 새 프로젝트를 만들거나 기존 프로젝트를 엽니다.
  2. 프로젝트 구조에서 CSS 파일을 생성하려는 폴더로 이동하세요.
  3. 폴더를 마우스 오른쪽 버튼으로 클릭하고 "새로 만들기" > "CSS 파일"을 선택하세요.
  4. 새 CSS 파일의 이름을 입력하세요.
  5. "만들기"를 클릭하세요.

고급 옵션:

  • 사전 설정된 템플릿 선택: WebStorm은 스타일시트 재설정 또는 그리드 레이아웃과 같은 다양한 사전 설정된 CSS 템플릿을 제공합니다. 템플릿 드롭다운 목록에서 필요한 템플릿을 선택할 수 있습니다.
  • 인코딩 설정: UTF-8 또는 UTF-16과 같은 올바른 인코딩을 선택했는지 확인하세요.
  • 파일 제목 추가: 포함된 파일 제목은 CSS 파일 시작 부분에 표시됩니다. 포함할지 여부를 선택할 수 있습니다.

새로 생성된 CSS 파일은 다음과 같습니다.

<code class="css">/*
 * CSS Reset
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 */

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role="list"],
ol[role="list"] {
  list-style: none;
}

/* Fix margins for blockquote elements in IE 11+ */
blockquote {
  margin: 0;
}

/* Normalize line height for headings 1 to 6 in Chrome, Firefox, and Safari */
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.2;
}

/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0ms !important;
    scroll-behavior: auto !important;
  }
}</code>

이제 CSS 파일에 스타일 작성을 시작할 수 있습니다.

위 내용은 Webstorm에서 새 CSS 파일을 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.