Theory
Theory

Connecting scripts

The web has the following division of roles: HTML is responsible for the structure of the document, styles are responsible for its appearance, and scripts are responsible for its behavior. With the help of scripts, for example, you can "animate" the page by adding animation and other effects. Scripts are created using the JavaScript language.

Scripts are attached in the same way as styles: they are either written inside the page or attached as external files.

Embedded scripts are written inside the <script> tag. For example:

<script>
  JavaScript code
</script>

The <script> tag can be used anywhere in the HTML document, but it is better to insert it at the very end, before the closing </body> tag.

index.html
style.css

HTML

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Connecting scripts</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Connecting scripts</h1> <p class="blinking">You can connect scripts in a number of ways. One way is to describe scripts directly inside the HTML page.</p>  </body> </html>

CSS

body { margin: 20px; font-size: 18px; line-height: 24px; } h1 { font-size: 52px; line-height: 64px; font-family: "Monaco", "Courier", monospace; color: #618ad2; } .big-font { font-size: 24px; line-height: 36px; } p { transition: font-size 0.5s; }

GoalsCompleted

Uncomment the <script> tag.