go back

refreshing my knowledge of HTML via w3bschools

"All HTML documents must start with a document type declaration: !DOCTYPE html."

"The HTML document itself begins with html and ends with /html. The visible part of the HTML document is between body and /body."

HTML LINKS are defined with 'a' tag

here's a link

this is --> a href="..." text... /a

HTML IMAGES are defined with 'img' tag.

-> SRC is the source file, URL

-> ALT is the alternative text

this is --> img src="..." width=".." height=".."

"Attributes usually come in name/value pairs like: name="value""

like href="link", or, img src= "path to img", or style="color", or width="number"

The href attribute of 'a' specifies the URL of the page the link goes to
The src attribute of 'img' specifies the path to the image to be displayed
The width and height attributes of 'img' provide size information for images
The alt attribute of 'img' provides an alternate text for an image
The style attribute is used to add styles to an element, such as color, font, size, and more
The lang attribute of the tag declares the language of the Web page
The title attribute defines some extra information about an element

meow meow meow meow meow meow

< hr > will separate content


it doesnt need a end tag


< br > will show a line break

it
doesn't
need
a end
tag

the tag < pre > will preserves spaces and lines:


roses r red

violets r blue

ur mom is fat

and so r u

however as u can see its in a diff font...

HTML STYLES

color, font size, etc.

"'tagname' style="property:value;"

background-color = bg color

color = text color

font-family = font used

font-size = text size = state as percentage

text-align = can be "centered heading" or "centered paragraph"

HTML Formatting Elements

< b > - Bold text : meow
< strong > - Important text : meow
< i > - Italic text : meow
< em > - Emphasized text meow
< mark > - Marked text meow
< small > - Smaller text meow
< del > - Deleted text meow
< ins > - Inserted text meow
< sub > - Subscript text meow
< sup > - Superscript text meow

HTML Quotation and Citation Elements

< blockquote > defines sections quoted from a source

< blockquote cite="link..." > text... < /blockquote>

For 60 years, WWF has worked to help people and nature thrive. As the world's leading conservation organization, WWF works in nearly 100 countries. At every level, we collaborate with people around the world to develop and deliver innovative solutions that protect communities, wildlife, and the places in which they live.

abbr defines abbreviations, uses title=

sybau means what it shows when you hover over it!

HTML Styles - CSS

CSS can be added to HTML documents in 3 ways:
Inline - by using the style attribute inside HTML elements
Internal - by using a style element in the head section
External - by using a link element to link to an external CSS file

Inline CSS

An inline CSS uses the style attribute of an HTML element.

"color:blue;"

Internal CSS

An internal CSS is defined in the < head > section of an HTML page, within a < style > element.

style
body { background-color: powderblue;}
h1 { color: blue;}
p { color: red;}
/style

this code would set the bg color to powderblue, as well make all H1 elements blue and all p elements red

External CSS

"An external style sheet is used to define the style for many HTML pages."
"To use an external style sheet, add a link to it in the head section of each HTML page:"

head link rel="stylesheet" href="styles.css" /head

CSS properties include border, padding (property defines a padding (space) between the text and the border), margin (property defines a margin (space) outside the border)

HTML Links

HTML links are hyperlinks.
a href="" > link text < /a >

href is the attritube that indicates the links destination

heres another link example for practice purposes.

HTML Links - The target Attribute

"By default, the linked page will be displayed in the current browser window. To change this, you must specify another target for the link."

The target attribute specifies where to open the linked document.

values for target attributes are

_self - Default. Opens the document in the same window/tab as it was clicked
_blank - Opens the document in a new window or tab
_parent - Opens the document in the parent frame
_top - Opens the document in the full body of the window

To use an image as a link, just put the < img > tag inside the < a > tag:

HTML Link Colors

You can change the link state colors, by using CSS:

Heres my practice that you can see lol.

you can use "under-line" as the text decoration...

shout out to lili lol