You can include external CSS and JavaScript files in HTML using the <link> and <script> tags respectively. This helps separate styling and behavior from HTML for better organization and maintainability.
1️⃣ External CSS
- Use the
<link>tag inside the<head>section. - Attributes:
rel="stylesheet"→ defines it as a stylesheethref→ path to the CSS file
Example:
<head>
<link rel="stylesheet" href="styles.css">
</head>
2️⃣ External JavaScript
- Use the
<script>tag, usually before the closing</body>tag for better performance. - Attribute:
src→ path to the JavaScript file
Example:
<body>
<h1>Hello World</h1>
<script src="script.js"></script>
</body>
Optional Attributes for <script>
defer→ loads script after HTML parsingasync→ loads script asynchronously without blocking HTML
Example with defer:
<script src="script.js" defer></script>
💡 In Short:
Use
<link>to include external CSS for styling, and<script>to include external JavaScript for functionality, keeping HTML clean and maintainable.
