Sunday, 15 April 2012

HTML Lesson #1-Basics

I'm going to start doing HTML lessons, so all you can learn as well as copy and paste!






I do all my editing in htmledit.squarefree.com-so I can make sure I like the html before I use it.




When I do my html's, I start with a wide range of options, but I usually like to start with:


<p style="


The p means paragraph, and the style means we are about to change the font, size, etcetera.


Then I usually like to put:


text-align:


Which, aligns the text! The choices are left, center, or right. If you don't put text-align it will self align to left. I like to put it as center.




Me, I'm English, but HTML is American, so I have to remember not to put 'centre' or 'colour'.




In between each little bit you have to put a semi colon, otherwise it will not work.






I don't like to have a boring black HTML, but of course at times it looks...Nice! To change the colour write:


color: 


Then write any colour in! Or you can write a colour code, which is basically a code, that when you put it in, it changes the colour! To get the colour codes go to: www.computerhope.com/htmcolor.htm








To change the font, write:


font-family:


And then a font! I get my fonts from: support.microsoft.com/kb/924623


Most of the fonts on that website work, but some do not work on html's :(








Background colour is one of the easiest things! All you have to do is write:


background-color:


and then a colour! You can use colour codes too ;D




To change the font size write:


Font-size: 10px


Change the 10px to a size you like!






Now for border!!!! For a border, write:


border: 10px double red


You can adjust the 10 to what you would like :D


You can change the red to a colour or a colour code.


You can change the double to any of these:


Double
None
Ridge
Groove (same as ridge)
Inset
Outset
Dotted
Dashed
Solid










Finally, starting the text!


Write:




">THE TEXT GOES HERE!!!</p>












I included all of these features in one html and it gave me this:









<p style=" text-align: center; color: pink; font-family: monotype corsiva; font-size: 40px; background-color: deeppink; border: 10px ridge deeppink;">Hey!</p>











Next Lesson: Shadows, Flashing Text and Sized Borders.




~mickeymouse409

No comments:

Post a Comment