Post: [BASICS] Basics of HTML
Options
11-29-2010, 12:22 AM
#1
Cain
Tutorial Team Like A Boss
You must login or register to view this content.
Hey it's Cain and today I will try as best as I can to show the true basics of HTML. HTML could be anything from changing fonts to changing backgrounds. So lets get started.
Please note there may not be any at the moment but there will be soon, as it will get updated every once in a few days.
Mods I ask please to not close/move/delete this thread as it will be one of the best tutorials on HTML on the forum sooner or later.
Hey it's Cain and today I will try as best as I can to show the true basics of HTML. HTML could be anything from changing fonts to changing backgrounds. So lets get started.
Please note there may not be any at the moment but there will be soon, as it will get updated every once in a few days.
Mods I ask please to not close/move/delete this thread as it will be one of the best tutorials on HTML on the forum sooner or later.
- Fonts
Fonts are crucial to the interwebz. Nobody likes Times New Roman as it was there since Windows NT. It is however famous for being the oldest font in History. Mac OSX once it first came out also used it.
So if you are looking to change the Font Type, simply type
<font face="[b]fontname[/b]">My font appears here</font>
If you want to change the color of a font to make your webpage look dazzy, simply type
<font color="[b]colorname[/b]">My color appears here</font>
If you want to change the size of a font, maybe make it large to grab your viewer's attention, type
<font size="[b]fontsizehere[/b]">Your size of font appears here</font>
- DIV's
DIVs are commonly needed if you are ever going to design a website. DIV's .. I explain them as simplified tables. You will see what I mean now.
If you want to start a div off, with no style, formatting, anything, type
<div>
IV Content goes here</div>
That is basically it. Now we can customize our DIV to suit our needs. Lets say.. we want it go to stretch to the full size of our screen. Easy.
<div style="width: 100%; height: 100%;">IV Content goes here.
That will make your whole DIV fit your web browser window. I've never seen any website do that so lets shorten it down a little bit.
<div style="width: 100%; height: auto";">IV Content goes here.</div>
Now we've made it so on the X axis it will stretch but on the Y it will only stretch to how much is inside the DIV. That is commonly used and alot better for webpages.
Lets say.. we want a background color on our DIV! Lets really make it look dazzly!
<div style="width: 100%; height: auto; background-color: [b]backgroundcolorname here or #colorid[/b];">IV content goes here</div>
Now your site will look purrty.
- Aligning
You can align anything about HTML easy. To center something, simply enter:
[noparse][center]Content here[/center][/noparse]
Thats just about it. It's exactly like the Center BB Code on this forum.
Want to move something to the left, easy.
[noparse][left]Content here[/left][/noparse]
Move something to the right? longer to type than left but
[noparse][right]Content here[/right][/noparse]
- Inserting Images
You can insert an image easily, you do need to know the Image location or the image will not show up. Use this code.
<img src="[b]imagelocation[/b]" border="no" />
I inserted border no because there are some webbrowsers such as IE6 that show a disgusting black border around the images. It doesnt look nice for some images, sometimes it does but its just for compatibility.
- Changing Background Color
Changing the background color is as easy as pie. For this we are going to change a boring white page into a cool.. orange page!
Depending if you are using a editor or not, you can simply type/replace:
<body bgcolor="[b]color[/b]">
Thats it. it's as easy as that. Note you can also use Color ID's like #ff0 will make your background red.
- Creating a Title
You can change the title of a page very easy, see at the top of your webbrowser, it says "[BASICS] Basics of HTML"? We'll make it say something cooler.. but on your webpage.
All you need to do is enter:
<title>My Cool webpage title!</title>
See how easy that also was!
- Font Formatting
Font formatting is making something bold, italic, underlined, or [s]stroked out![/s]
To do them you can very simply type:
<b>Bold Text</b>
<u>Underlined Text</u>
<i>Italic Text</i>
<s>strikeout Text</s>
Last edited by
Cain ; 11-29-2010 at 12:33 AM.
The following 4 users say thank you to Cain for this useful post:
11-29-2010, 08:14 PM
#2
xPinnacle--
Who’s Jim Erased?
11-30-2010, 09:16 PM
#5
Richard Branson
Brute
There is also headings, and a paragraph you MAY want to add, here are the codes if you do:
[p]Paragraph writing here[/p]
[h1]Heading1[/h1]
[h2]Heading2[/h2]
[h3]Heading3[/h3]
[h4]Heading4[/h4]
[h5]Heading5[/h5]
[h6]Heading6[/h6]
Hope these help, and I think they are right, long time since I learned + used HTML.
Good luck with you're further Basics of Coding Language
[p]Paragraph writing here[/p]
[h1]Heading1[/h1]
[h2]Heading2[/h2]
[h3]Heading3[/h3]
[h4]Heading4[/h4]
[h5]Heading5[/h5]
[h6]Heading6[/h6]
Hope these help, and I think they are right, long time since I learned + used HTML.
Good luck with you're further Basics of Coding Language
Copyright © 2024, NextGenUpdate.
All Rights Reserved.
