ITEC 106 (SIR JARED) Flashcards
Hyper Text Markup Language
Created by Tim Berners-Lee, Robert Cailliau, and others starting in
1989
means the document contains links that allow the reader
to jump to other places in the document or to another document
altogether
Hypertext
is a way that computers speak to each other to
control how text is processed and presented. To do this HTML uses
two things: tags and attributes.
A Markup Language
are used to mark up the start of an HTML element and they are
usually enclosed in angle <> brackets.
Tags
contain additional pieces of information. Attributes take
the form of an opening tag and additional info is placed inside.
Attributes
Golden Rules To Remember
The vast majority of tags must be opened (<tag>) and closed
(</tag>) with the element information such as a title or text resting
between the tags.
2. When using multiple tags, the tags must be closed in the order in
which they were opened. For example
This tag specifies the language you will write on
the page. In this case, the language is HTML 5.
<!DOCTYPE html>
This tag signals that from here on we are going to write in
HTML code.
<html>
</html>
This is where the content of the page goes
<body>
</body>
Inside the <head> tag, there is one tag that is always included: <title>,
but there are others that are just as important</title>
Further Tags
This is where we insert the page name as it will appear at the top of
the browser window or tab.
<title>
</title>
This is where information about the document is stored: character
encoding, name (page context), description
<meta></meta>
We also have a number of
other elements we can use
to control the text or make
it appear in a certain way
Other elements
= Hypertext REFerence
- href
is important to ensure that your site is ranked correctly on
search sites and also for visually impaired visitors to your site.
*Alt text
file types generally used for image files online are:
.jpg, .png, and
.gif
is an ordered
list of contents
Ordered List
This is better
known as a bullet point list and
contains no numbers.
Unordered List
e is defined using the <table> element, and contains a number of
table cells ( <td>, for “table data” ) which are organized into table rows
( <tr>)
Table tag
are required, when you want to collect some data from
the site visitor. For example, during user registration you would like to
collect information such as name, email address, credit card, etc
html forms
always starts on a new line, and the browsers
automatically add some space (a margin) before and after the
element.
Block-level Element
always takes up the full width available
(stretches out to the left and right as far as it can).
Block-level Elemen
does not start on a new line.
Inline Elements
only takes up as much width as necessary.
Inline Elements
clearly describes its meaning to both the browser
and the developer.
semantic element
element defines a section in a document.
<section>
</section>
element specifies independent, self-contained content.
<article>
</article>
should make sense on its own, and it should be possible to distribute it independently from the rest of the web site.
An article
element represents a container for introductory content or a set of navigational links.
<header>
</header>
<header>
</header>
<footer>
</footer>
element defines a set of navigation links.
<nav>
</nav>
element defines some content aside from the content it is placed in (like a sidebar).
<aside>
</aside>
content should be indirectly related to the surrounding content
<aside>
</aside>
tag specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.
<figure>
</figure>
element can be placed as the first or as the last child of a <figure> element.</figure>
<figcaption>
</figcaption>
tag defines a caption for a <figure> element</figure>
<figcaption>
</figcaption>
Defines a date/time
<time>
</time>
Defines a visible heading for a <details> element</details>
<summary>
</summary>
Defines a section in a document
<section>
</section>
Specifies the main content of a document
<main>
</main>
Defines marked/highlighted text
<mark></mark>
Defines additional details that the user can view or hide
<details>
</details>
He is best known for developing Cascading Style
Sheets (CSS) while working with Tim Berners-Lee and Robert Cailliau
at CERN in 1994.
*Håkon Wium Lie
is a style sheet language used for
describing the presentation of a document written in a markup
language such as HTML or XML
Cascading Style Sheets (CSS)
describes how HTML elements are to be displayed on screen, or
in other media
CSS
” in CSS refers to the fact that styling rules “cascade”
down from several sources.
cascading
points to the HTML element you want to style.
selector
contains one or more declarations separated by
semicolons
declaration block
Multiple CSS declarations are separated with ___ , and
declaration blocks are surrounded by curly braces.
semicolons
are used to “find” (or select) the HTML elements you
want to style.
CSS selectors
s (select elements based on name, id, class)
Simple selectors