(updated: https://www.kidzsearch.com/questions/383957/learn-html-here-repost-updated-css-too)
Hey guys! So, you clicked on this post to learn HTML, eh? Well, your in the right place!
HTML is a programming language that is fun and frustrating at times.
HTML stands for HyperText Markup Language
You could use it to make forums, websites, documents, and MORE!
So, lets get started!
Create a new file in a folder called index.html (i recommend using https://vscode.dev)
First, you put <DOCTYPE! html> at the top on line 1! (formatting is important so you can read your code)
After that, put <html>, if your code editor is good (i recommend https://vscode.dev) it should auto generate </html> after that. the <html> and </html> things are called tags, you can put things in them!
After you put that, put <head> in between the <html> tags. Anything inside a tag is called content, and tags and content together are called elements! please remember these words for later.
After you put your head tags, put <title> inbetween <head> and </head>
that is the data that will be applied to your document!
after that, in between <title> and </title>, put whatever you want! When you open the document in your files, it will open a page on your browser! Then if you look at the tab name, what you put in the title tags will be there!
-------------------CONTINUED-------------------
After that, below the </head> tag, put <body>
<body> is the element that will hold everything that the user can see (images, gifs, text, etc.)
Put <h1>, and inside those <h1> tags, put whatever text you want!
When you reload the page, it will show big text!
Try that with <h2>, <h3>, <h4>, <h5>, and <h6>!
Those are the headers! Now, lets make paragraphs!
put <p> tags. Like the headers, put text inside them to show that text!
So, you put the text, right?
put a new line in the <p> tag, and on that new line, put text!
do you notice something? Yep, that new line doesn't break apart the text!
to do that, put <br> for a new line!
this also spaces apart elements if your too lazy to use padding (we will get into that later)
also, you can put images! In your files, put an image in the same folder as your html file
then put <img src="image.png" height="50" width="50">
that will create an image on your page that is exactly 50 pixels tall and 50 pixels wide.
but, the image will lose all of its proportions!
to keep them, remove the width="50" or height="50" part of your image tag.
So, that's done!
next, we will learn how to put videos and audio.
-------------------CONTINUED-------------------
so, lets say you want AUTOPLAYING BACKGROUND MUSIC
put an <audio> tag, also, for images, videos, or audio, you don't need the second tag.
put <audio src="audio.mp3" autoplay>
that will put auto-playing background music.
also, experiment with images, videos, and audio!
there is also stuff you can put in the tag with autoplay, like controls, and looped!
now, lets put a video!
put a <video> tag
in that tag, put autoplay, looped, and controls
it should look like this
<video src="video.mp4" autoplay looped controls>
that will put a video on the screen. and btw, the height= and width= stuff works with almost all tags!
thats it for now!
-------------------END-------------------
I'll edit this and continue this soon. I might create a new post whether you can edit posts or not. Bye bye!
