How to include CSS and JavaScript in an HTML page?
You can link to external CSS and JavaScript files using the `<link>` and `<script>` tags respectively, which is recommended for larger projects to keep your code organized, but you can also include CSS and JavaScript codes in your HTML file.
To include CSS and JavaScript in an HTML page,
you can use the <style> tag for CSS and the <script>
tag for JavaScript. Here's a basic example for your first project:
Html
<!DOCTYPE html>
<html lang="en">
<head>
<meta
charset="UTF-8">
<meta
name="viewport" content="width=device-width,
initial-scale=1.0">
<title>Your Page
Title</title>
<!-- CSS Styles
-->
<style>
/
Your CSS code goes here /
body
{
background-color:
#f0f0f0;
font-family:
Arial, sans-serif;
}
h1
{
color:
blue;
}
</style>
</head>
<body>
<!-- Your HTML
content -->
<!-- JavaScript
-->
<script>
//
Your JavaScript code goes here
document.addEventListener('DOMContentLoaded',
function () {
//
JavaScript code to be executed after the DOM is ready
console.log('Page
loaded!');
});
</script>
</body>
</html>
```
In this HTML Webpage:
· The CSS is placed between the `<style>`
tags within the `<head>` section.
· The JavaScript is placed between the
`<script>` tags, and the `DOMContentLoaded` event is used to
ensure that the script runs after the HTML has been completely loaded. Read
more about DOMContentLoaded event.