How to make your own HTML welcome messages!

html

#1

Here is guide how to make your own welcome message.

There are several ways, but here are a few

Way one

Way one: Go to a tutorial website. Here’s one that i recommend if you are just starting https://www.w3schools.com/html/

Way two

Way two use a guide from the forms: Here is the most poular: Welcome message html tutorial By Qwerty_ASD

Or way three: read mine

Every HTML document starts with

<!DOCTYPE HTML>
<HTML>
<BODY>
and ends with
</BODY>
</HTML>

I important thing to notice it that every HTML tag starts with `<>` and ends with

Note: </RIGHT HERE> and <RIGHT HERE> you put what kind of tag it is

You can make different sizes of letters

This size is called h1

This size is called h2

This size is called h3

This size is called h4

This size is called h5
This size is called h6

There tag is <H1> message </H1> Replace h1 with h2, h3 ECT
The h1,h2, ETC. mean Header One, Header Two, ECT.


Paragraphs

Paragraphs are simple, you start with `<p`

and end with

Colored text

How to make text have color: i will do it with a paragraph: `

`
You end with `

not ``

This will make your text between <p style="color:blue;"> and </p> blue
You CAN make text different colors, just enter your color instead of blue( You can also use Hex Codes instead of a color)

How to make RaInBoW text

<span style="color:#f00">R</span>
<span style="color:#f50">a</span>
<span style="color:#ff0">i</span>
<span style="color:#5f0">n</span>

That will then make rainbow text on your welcome message :wink:

Buttons

Here is a example how to make a button that then, once you press it, it shows the time!!

<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>

Awesome, right? Lets try a different button!!

Heres how to make a button that changes the background color!!

<p id="demo">HTML rocks!!</p>

<script>
function myFunction() {
  document.getElementById("demo").style.fontSize = "50px"; 
  document.getElementById("demo").style.color = "green";
  document.getElementById("demo").style.backgroundColor = "blue";        
}
</script>

<button type="button" onclick="myFunction()">Click Me!</button>

This code is COOL once you test it out!!

Bold and Italic

Both very simple
Put <i> and </i> on the sides of your text that you want to be italic

and put <b> and </b> on the sides of your text that you want to be bold

How you make POP-UP text

Pop-up text go’s like this <script>alert("YOUR TEXT HERE")</script>

How to make different fonts

<p style="font-family:'Courier New'">This is placeholder text</p>

Enter your font name font-family:'Courier New'" here and it will become your font

Sorry if i forgot anything, i was in a hurry to make this, i will come back later and make it easer to read
-Lava

HTML Pros Needed!
#2

And this is already included in the welcome message - so don’t add your own!

Looks like your colored text section is broken.


#3

I never add that to my code because I just find it unnecessary.

And for those planning on adding yellow test please don’t unless you are using a black background :slight_smile:


#4

Ok i did not know that :smiley: