Heim  >  Artikel  >  Entwicklungswerkzeuge  >  So erstellen Sie eine neue CSS-Datei in Webstorm

So erstellen Sie eine neue CSS-Datei in Webstorm

下次还敢
下次还敢Original
2024-04-08 16:00:26843Durchsuche

So erstellen Sie eine neue CSS-Datei in WebStorm: Öffnen Sie die Projektstruktur, klicken Sie mit der rechten Maustaste auf „Neu“ > „CSS-Datei“ im Zielordner. Geben Sie den Dateinamen ein, wählen Sie die voreingestellte Vorlage und Kodierung aus, legen Sie fest, ob der Dateititel einbezogen werden soll, und klicken Sie auf „Erstellen“.

So erstellen Sie eine neue CSS-Datei in Webstorm

So erstellen Sie eine neue CSS-Datei in WebStorm

Schritte zum Erstellen einer neuen CSS-Datei:

  1. Öffnen Sie WebStorm und erstellen Sie ein neues Projekt oder öffnen Sie ein vorhandenes Projekt.
  2. Navigieren Sie in der Projektstruktur zu dem Ordner, in dem Sie die CSS-Datei erstellen möchten.
  3. Klicken Sie mit der rechten Maustaste auf den Ordner und wählen Sie „Neu“ > „CSS-Datei“.
  4. Geben Sie einen Namen für die neue CSS-Datei ein.
  5. Klicken Sie auf „Erstellen“.

Erweiterte Optionen:

  • Wählen Sie eine voreingestellte Vorlage: WebStorm bietet eine Vielzahl voreingestellter CSS-Vorlagen, wie zum Beispiel das Zurücksetzen des Stylesheets oder das Rasterlayout. Sie können die benötigte Vorlage aus der Dropdown-Liste „Vorlage“ auswählen.
  • Kodierung festlegen: Stellen Sie sicher, dass Sie die richtige Kodierung auswählen, z. B. UTF-8 oder UTF-16.
  • Dateititel hinzufügen: Der enthaltene Dateititel wird am Anfang der CSS-Datei angezeigt. Sie können wählen, ob Sie es einschließen möchten oder nicht.

Die neu erstellte CSS-Datei sieht folgendermaßen aus:

<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>

Sie können jetzt mit dem Schreiben von Stilen in die CSS-Datei beginnen.

Das obige ist der detaillierte Inhalt vonSo erstellen Sie eine neue CSS-Datei in Webstorm. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn