はじめに
この実験では、all プロパティを使用してすべてのスタイルを初期値にリセットする概念を探ります。この実験が終了すると、このプロパティを使用して継承されたスタイルと継承されないスタイルの両方を元の値にリセットする方法を明確に理解しているでしょう。これにより、個々のプロパティをそれぞれリセットする必要なく、要素のスタイリングを迅速かつ簡単にリセットすることができます。
これは Guided Lab です。学習と実践を支援するためのステップバイステップの指示を提供します。各ステップを完了し、実践的な経験を積むために、指示に注意深く従ってください。過去のデータによると、この 初級 レベルの実験の完了率は 100%です。学習者から 96% の好評価を得ています。
すべてのスタイルをリセットする
VM には既に index.html と style.css が用意されています。
すべてのスタイルを初期値にリセットするには、all プロパティを使用します。このプロパティは direction と unicode-bidi プロパティには影響しません。その使用方法の例を以下に示します。
<div class="reset-all-styles">
<h5>Title</h5>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id
exercitationem nulla qui repellat laborum vitae, molestias tempora velit
natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?
</p>
</div>
.reset-all-styles {
all: initial;
}
右下隅の「Go Live」をクリックして 8080 ポートでウェブサービスを実行してください。その後、Web 8080 タブを更新してウェブページをプレビューできます。
まとめ
おめでとうございます！あなたは「すべてのスタイルをリセットする」実験を完了しました。あなたの技術を向上させるために、LabEx でさらに多くの実験を練習できます。