Html anatomy: Difference between revisions
From wikinotes
Line 8: | Line 8: | ||
<title>My Website</title> | <title>My Website</title> | ||
<script src="main.js"/> | <script src="main.js"/> | ||
<link rel="stylesheet" href="stylesheet.css" /> | |||
</head> | </head> | ||
<body> | <body> |
Revision as of 03:56, 17 December 2022
Sample File
<!doctype html public "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html lang="en"> <head> <title>My Website</title> <script src="main.js"/> <link rel="stylesheet" href="stylesheet.css" /> </head> <body> <h1>My Title</h1> <p>Some paragraph</p> </body> </html>
Components
Tags/Elements
HTML is expressed using html elements expressed in tags (ex:
<div>
).
Tags are opened/closed<div>...</div>
.
Some tags may have attributes.
<img src="foo.png">Some attributes are applicable to all elements, and are primarily intended for styling/dynamic manipulation.
- id must uniquely identify a single element per document
- class may refer to several elements in a document
<div id="unique-name-within-document"> <div class="employee-list">DOM/APIs
The body of a website is composed of html elements. It is primarily composed of elements, but APIs expose access to the document, window, history etc.
The Document Object Model (DOM) is a tree of all of the elements in a page.
CSS
The layout of html documents is usually defined in css.
javascript
Sometimes javascript is used to modify the website more dynamically.