Frontend Development

[BasicHTML] - Learn Simple HTML-Coding #001

Submitted by Weytaan, , Thread ID: 12333

Thread Closed
Is this tutorial helpful for you?
Yes
75.00%
Votes:
3
% of votes:
75.00%
No (please write why!)
25.00%
Votes:
1
% of votes:
25.00%
You have already voted. Click on the dropdown to undo your vote.
Weytaan
COWYS2
Prime
Level:
0
Reputation:
12
Posts:
423
Likes:
11
Credits:
20
04-11-2015, 12:13 AM
This post was last modified: 04-11-2015, 12:22 AM by Weytaan
#1
Heya(:

I want to show you many basics and features etc. from HTML.
In the first lesson you will learn how to create an very basic and simple
HTML page. Means you learn your first HTML commands.

Step 1.
-> Open Notepad ++ or Atom.
Now you write into the Editor

Code:
<!DOCTYPE html>
<html>





<body>






</body>
</html>

After you write that you have your page to that point rdy. But when you now open your page. Nothing will be showed.
Now we change the Title of the Website.

Step 2. [The Website Title]
-> Very simple. Anywhere below the <html> tags you write the following:

Code:
<title> My first HTML Page. </title>

Now your site has an title in the Tablist.
[Image: MEERheszzghx.png]

Step 3. [Your first Text!]
-> Simple too, now we create our first text. We want an middle text and an big
text. for that you write below <body> this:

Code:
<h1><center> Hello. This is my Website! </center></h1>

Now it looks like this:

[Image: LC42aHvqLk4m.png]

[Image: 3SAkXdwPYtMx.png]

Step 4. [Your First Picture!]
-> Yeah what did you think? RIGHT! Simple too:yus:
write the following below <body>.

Code:
<center><img src="Your Picture link!"></center>



Now it looks like this:

[Image: ErvVKfWAgfmw.png]

Yeees, that is it for the first part of my tutorials. Hope you enjoyed it :)
Soon the next part comes out. There you learn how to create an second page.
And an Button to that page.

If you need any help post here.

##############################
Downloads you need for that Tutorial:

Atom - CLICK
or
Notepad ++ - CLICK
##############################
Download Basic HTML Template: (Optional)

Template - CLICK
##############################



Greez,
Weytaan
The crown makes you bigger, but not more powerful.

RE: [BasicHTML] - Learn Simple HTML-Coding #001

Senpai
?
Level:
0
Reputation:
321
Posts:
9.01K
Likes:
923
Credits:
328
04-11-2015, 12:15 AM
#2
Nice tutorial OP.
I'm sure many people will find this useful.
Keep it up! :yus:
Aisaka
Anbu is cool I guess.
My padawan: Asa
[Image: LVRtdlA.png]

RE: [BasicHTML] - Learn Simple HTML-Coding #001

Weytaan
COWYS2
Prime
Level:
0
Reputation:
12
Posts:
423
Likes:
11
Credits:
20
OP
04-11-2015, 12:17 AM
#3
04-11-2015, 12:15 AM
Asa Wrote:
Nice tutorial OP.
I'm sure many people will find this useful.
Keep it up! :yus:

Thank you Asa Smile
The crown makes you bigger, but not more powerful.

RE: [BasicHTML] - Learn Simple HTML-Coding #001

Coin
Level:
0
Reputation:
59
Posts:
1.13K
Likes:
54
Credits:
243
04-11-2015, 12:28 AM
#4
center tag should be outside h1 tag Smile


Nice tutorial

RE: [BasicHTML] - Learn Simple HTML-Coding #001

Weytaan
COWYS2
Prime
Level:
0
Reputation:
12
Posts:
423
Likes:
11
Credits:
20
OP
04-11-2015, 12:30 AM
#5
04-11-2015, 12:28 AM
Kill Wrote:
center tag should be outside h1 tag Smile


Nice tutorial

Yes, can be. But works inside too (:
I prefer inside.

and thanks:yus:
Greez,
Weytaan
The crown makes you bigger, but not more powerful.

RE: [BasicHTML] - Learn Simple HTML-Coding #001

Weytaan
COWYS2
Prime
Level:
0
Reputation:
12
Posts:
423
Likes:
11
Credits:
20
OP
07-11-2015, 10:00 PM
This post was last modified: 07-11-2015, 10:00 PM by Weytaan
#6
// NEXT TUTORIALS COMES TOMORROW! \\
Hope you enjoy Smile :yus:

Greez,
Weytaan
The crown makes you bigger, but not more powerful.

RE: [BasicHTML] - Learn Simple HTML-Coding #001

Coin
Level:
0
Reputation:
59
Posts:
1.13K
Likes:
54
Credits:
243
07-11-2015, 10:24 PM
#7
07-11-2015, 10:00 PM
Weytaan Wrote:
// NEXT TUTORIALS COMES TOMORROW! \\
Hope you enjoy Smile :yus:

Greez,
Weytaan

Sounds good!

One thing, try to format the thread good, so its organized.

RE: [BasicHTML] - Learn Simple HTML-Coding #001

v4hl
Legend
Divine
Level:
14
Reputation:
364
Posts:
6.27K
Likes:
2.19K
Credits:
425
07-11-2015, 10:26 PM
#8
Nice share man, Waiting more TUT buddy Wink ++
[Image: xRnLbpm.png]
[Image: Tz6Qsg4.png]

RE: [BasicHTML] - Learn Simple HTML-Coding #001

Weytaan
COWYS2
Prime
Level:
0
Reputation:
12
Posts:
423
Likes:
11
Credits:
20
OP
07-11-2015, 10:28 PM
This post was last modified: 07-11-2015, 10:29 PM by Weytaan
#9
07-11-2015, 10:24 PM
Kill Wrote:
07-11-2015, 10:00 PM
Weytaan Wrote:
// NEXT TUTORIALS COMES TOMORROW! \\
Hope you enjoy Smile :yus:

Greez,
Weytaan

Sounds good!

One thing, try to format the thread good, so its organized.

Thank you and i will Smile

07-11-2015, 10:26 PM
v4hl Wrote:
Nice share man, Waiting more TUT buddy Wink ++

Thank you, comes tomorrow Smile
The crown makes you bigger, but not more powerful.

RE: [BasicHTML] - Learn Simple HTML-Coding #001

v4hl
Legend
Divine
Level:
14
Reputation:
364
Posts:
6.27K
Likes:
2.19K
Credits:
425
07-11-2015, 10:30 PM
#10
07-11-2015, 10:28 PM
Weytaan Wrote:
07-11-2015, 10:24 PM
Kill Wrote:
07-11-2015, 10:00 PM
Weytaan Wrote:
// NEXT TUTORIALS COMES TOMORROW! \\
Hope you enjoy Smile :yus:

Greez,
Weytaan

Sounds good!

One thing, try to format the thread good, so its organized.

Thank you and i will Smile

07-11-2015, 10:26 PM
v4hl Wrote:
Nice share man, Waiting more TUT buddy Wink ++

Thank you, comes tomorrow Smile

i ll :nerdy:
[Image: xRnLbpm.png]
[Image: Tz6Qsg4.png]

Users browsing this thread: 9 Guest(s)