This is my sketchpad. It is a basic webpage that can be used as a reference for coding more complex pages

In fact, I have something to tell you

This is a Heading

This is a smaller heading

And so on...

And so on...

And so on...

...I think you get the picture

How does the title attribute only display one word? How does it do that?

How does the title attribute only display one word? How does it do that?

How does the title attribute only display one word? How does it do that?

The answer is in the quotes, or lack thereof.

The pre tag preserves both spaces and line breaks:

    We fear death, the unknown.

    Death fears us, the unknowable.

    We fear death’s necessity.

    Death fears our Divinity.

   We fear death, the unknown. Death fears us, the unknowable.We fear death’s necessity. Death fears our Divinity.

We fear death, the unknown. Death fears us, the unknowable. We fear death’s necessity. Death fears our Divinity.

Hope
Knows no fear.

Hope dares to blossom
Even inside the abysmal abyss.

Hope secretly feeds
And strengthens
Promise.

Hope

Knows no fear.

Hope dares to blossom

Even inside the abysmal abyss.

Hope secretly feeds

And strengthens

Promise.

This text is important!

This text is bold but not important. Apparently?

Here is some emphasized text

Here is some italic text

Literally what is the difference?

The difference comes from the screen reader. It will read out words using verbal stress when using the (em) tag. As far as bold and strong goes, there doesn't seem to be much of a difference there. Other formatting tags make a bigger difference.

This is some smaller text.

This is some highlighted text. Use CSS to change the color of the highlight

This is a paragraph with deleted text. Using this tag creates a line through the words. It defines text that has been deleted from a document, because apparently you can't just go back and delete the words completely. Idk what that's about but I guess if it works it works.

And here is a paragraph with the same concept except with added text. This tag creates a line under the words. It defines text that has been added to a document, because apparently you can't just get it right the first time

This is _subscripted text. Like H₂O

This is ^{superscripted} text...not really sure what this would be used for tbh...maybe a ^footnote or something

More formatting things:

The paragraph below is formatted with blockquotes. Not sure what the cite attribute is for as it doesn't show up on the page, but it's cool.

It seems you have stumbled your way into my humble abode! I am Tay, the Music Nerd. I am proudly from the USA, and I am 30 years old so Iv'e just now gotten the hang of adulting (mostly). Some of my biggest interests include music (Wow!), anime/stories, art/graphics, gardening, and philosophy.

The following sentence is quoted with the (q) tag. You would use it when you want to quote someone for something

The abbreviation tag is used for abbreviations, like BBC. It is useful information for browsers, translators, and search engines.

The Scream by Edvard Munch. Painted in 1893. It is my favorite painting. That was also the cite tag.

Things To Remember:

1. All HTML elements can have attributes
2. The href attribute of (a) specifies the URL of the page the link goes to
3. The alt attribute of (img) provides an alternate text for an image
4. The style attribute is used to add styles to an element, such as color and font. The syntax goes like this: (tagname style="property:value;") The property is a CSS property. The value is a CSS value.
5. The lang attribute of the (html) tag declares the language of the Web page
6. HTML headings only go from 1 to 6. The largest is 1 while the smallest is 6.

How Colors Work - Starring LightSeaGreen:

#RRGGBB

A color can be specified using a hexadecimal value, where rr (red), gg (green) and bb (blue) have values between 00 and ff (same as decimal 0-255).
For example, #ff0000 is displayed as red, because red is set to its highest value (ff), and the other two (green and blue) are set to 00. Another example, #00ff00 is displayed as green, because green is set to its highest value (ff), and the other two (red and blue) are set to 00. To display black, set all color parameters to 00, like this: #000000. To display white, set all color parameters to ff, like this: #ffffff.

Shades of gray can be made using equal values for all three parameters:

#404040

#a0a0a0

#bebebe

#f8f8f8

hsl(hue, saturation, lightness)

A color can be specified using hue, saturation, and lightness. Hue is a degree on the color wheel from 0 to 360. 0 is red, 120 is green, and 240 is blue. Saturation is a percentage value. 0% means a shade of gray, and 100% is the full color. Lightness is also a percentage value. 0% is black, and 100% is white.

Shades of gray can be defined by setting the hue and saturation to 0, and adjusting the lightness from 0% to 100% to get darker/lighter shades:

hsl(0, 0%, 20%)

hsl(0, 0%, 60%)

hsl(0, 0%, 90%)

rgb(red, green, blue)

Each parameter defines the intensity of the color with a value between 0 and 255. This means that there are 256 x 256 x 256 = 16777216 possible colors!
For example, rgb(255, 0, 0) is displayed as red, because red is set to its highest value (255), and the other two (green and blue) are set to 0. Another example, rgb(0, 255, 0) is displayed as green, because green is set to its highest value (255), and the other two (red and blue) are set to 0. To display black, set all color parameters to 0, like this: rgb(0, 0, 0). To display white, set all color parameters to 255, like this: rgb(255, 255, 255).

Shades of gray can be made using equal values for all three parameters:

rgb(60, 60, 60)

rgb(180, 180, 180)

rgb(240, 240, 240)

Here is LightSeaGreen, but with 50% transparency:

rgba(red, green, blue, alpha)

RGBA color values are an extension of RGB color values with an Alpha channel - which specifies the opacity for a color The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (not transparent at all):

hsla(177, 70%, 41%, 0.5)

The alpha parameter can be used with HSL in the same way that it can be used with RGB.

In addition to the predefined color names, colors can be specified using RGB, HEX, HSL, or even transparent colors using RGBA or HSLA color values.

• HTML Cheatsheet