ホームページ  >  記事  >  開発ツール  >  Sublime テストで CSS を実行する方法

Sublime テストで CSS を実行する方法

下次还敢
下次还敢オリジナル
2024-04-03 12:03:18575ブラウズ

Sublime Text で CSS を実行する手順: HTML ファイルを開き、<head> タグ内に <style> タグを追加して CSS を含めます。 HTML ファイルを保存して CSS を保存します。メニューの「表示」から「ライブプレビュー」を選択して、リアルタイム効果をプレビューします。 CSS を編集して保存すると、プレビューがリアルタイムで更新されます。

Sublime テストで CSS を実行する方法

Sublime Text を使用して CSS を実行する方法

Sublime Text は、組み込みのCSS ランナーでは、CSS コードの効果をすばやくプレビューするのに役立ちます。 Sublime Text で CSS を実行する手順は次のとおりです。

ステップ 1: HTML ファイルを開きます

Sublime Text で、プレビュー CSS コードを含む HTML ファイルを開きます。

ステップ 2: HTML の <head> セクション内に <style>

タグ

を追加します。ファイルに、実行する CSS コードを含む <style> タグを追加します。例:

<code class="html"><head>
  <style>
    /* 你的 CSS 代码 */
  </style>
</head></code>

ステップ 3: HTML ファイルを保存する

HTML ファイルを保存して、新しく追加した CSS コードを保存します。

ステップ 4: ライブ プレビューを実行する

次のコマンドのいずれかを選択してライブ プレビューを実行します:

  • Mac: 表示 > ブラウザでプレビュー > ライブ プレビュー
  • Windows: 表示 > ブラウザでプレビューを表示 > ライブ プレビュー
  • Linux: 表示 > ブラウザでプレビュー > ライブ プレビュー

ステップ 5: CSS 効果をプレビュー

ライブ プレビュー ウィンドウには、リアルタイム プレビューが表示されます。 HTML ファイル。追加した CSS コードが適用されます。 CSS コードを変更して、ファイルを保存するとすぐにその効果を確認できます。

以上がSublime テストで CSS を実行する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。