External style sheet का उपयोग आमतौर पर तब किया जाता है जब आप कई पृष्ठों पर परिवर्तन करना चाहते हैं। यह इस स्थिति के लिए आदर्श है क्योंकि यह आपको केवल एक फ़ाइल को बदलकर संपूर्ण वेब साइट का रूप बदलने की सुविधा देता है।
यह हर पेज पर <link> tag का उपयोग करता है और <link> tag को head section के अंदर रखा जाना चाहिए।
उदाहरण:
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
external style sheet को किसी भी text editor में लिखा जा सकता है, लेकिन उसे .css एक्सटेंशन के साथ save किया जाना चाहिए। इस फ़ाइल में HTML तत्व नहीं होने चाहिए।
चलो एक style sheet फ़ाइल का उदाहरण लेते हैं जिसका नाम “mystyle.css” है।
File: mystyle.css
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}
नोट: आपको property value और इकाई के बीच के स्थान का उपयोग नहीं करना चाहिए। उदाहरण के लिए: इसे margin-left:20px होना चाहिए margin-left:20 px नहीं।