Posts Tagged ‘html’
HTML Links Easy and Quick
To create a hyperlink the syntax will look as follows:
<a href="lastpage.htm"> this text </a>
To enter a world wide web address it must look like this
<a href="http://www.codebrainercommunity.com"> Codebrainer </a>
Using an image is a little bit more difficult so i will let you practice this for now and i will introduce that next. Thanks for reading. Feel free to leave comments.
Sincerely,
Brick
Tags: html, Hyperlinks, links, world wide web
Html Attributes
HTML attributes provide additional information on HTML tags. They always come in a name/value pair and they are always specified at the beginning of a tag. Always use lowercase attributes. Here are some examples.
<h1 align="center" > Hello </h1>
This will align the heading to the center and you can do it to the left or right also.
<body bgcolor="black" text="white">
This makes the background black and any text white.These are simple but they are easy to learn off of.
Ok so if you have something that has an quotes in the value you do it like so:
name='steve "blackbear" johnson'
Again if you need help I am willing to answer. Thanks for reading.
Sincerely,
Brick
Tags: attributes, body color, html, name/value
Html Easy Tags
Ok so now we are started and we have an elementary sense of HTML. We’ll be going over some of the more common tags used a lot in HTML.
First, the tags always have <> around them, they end with </>. The first tag will be the <p> tag. This describes a paragraph.
Then there is the <h> tag, it spans from <h1> to <h6> this describes how big a heading will be.
The <br> tag describes a break in text. You have to close a break tag like so: <br/>
The horizontal rule is a way to have a line across your page. You leave the<hr> tag to do so.
Finally, the comment tag. A comment in the code is not read by the browser but is a way to leave notes for yourself and other things too. You do this by:
<!– this is a comment –>
This is just a brief overview of HTML elements or tags. As always thanks for reading.
Sincerely,
Brick
Tags: break, comment, heading, horizontal rule, html, tags
Html Introduction
Today we are going to talk about one of the simplest web development languages there is around; HTML or Hyper Text Markup Language. HTML is a set of markup tags that tells the browser what to display.
The way i learned was from windows notepad but if you have a Mac you can start simple text. Type this in your text editor.
<html>
<head>
<title> title of page </title>
</head>
<body>
My first home page
</body>
</html>
Save this page as page.htm, then open it in your browser by hitting CTRL+O and selecting the document.
Ok so the tag <html> is saying that it is and HTML document. The <head> tag is header information that is not displayed on the browser. The <title> tag is obiously the title that is displayed in the browser caption. The <body> tag dispays whatever is in between it. One tip is to always leave your tags lowercased as this is becoming the standard. As always thank you for reading.
Sincerely,
Brick
Tags: html, mac, tags, text editor, windows, windows notepad
CSS lesson 2
Today we will be exploring the regions known as grouping and some common selectors. So lets jump in to it!!!
With grouping you can put more selectors in a group that you would like to change. For example you can change all of the headings at once. You must put a comma in between all of the selectors first though. In practice it would look like this.
h1,h2,h3
{
text-align: center
}
I am puting a specific line of code on each line to make it easier to read.
The first selector we will look at will be the class selector. With the class selector you can define different styles for the same HTML element. A good example is if you want to different paragraphs to be aligned.
p.left {text-align: left}
p.center {text-align: center}
You have to use the class element in an HTML document:
<p class="left"> This paragraph will be left-aligned.</p>
<p class="center"> This paragraph will be center-aligned. </p>
To apply more that one class to a given element here is how it would look
<p class="center bold"> This is a paragraph. </p>
Ok so now we will see some ID selectors. This is just another way to define styles for HTML elements. It is a # that defines it.
#blue {color: blue}
The rule above will match a style that has an ID of blue.
So now this chapter comes to a close. As always i am grateful that you have read this and i hope you have taken something from it.
Sincerely,
Brick
Tags: class, code, CSS, html, selector
CSS Beginners Guide
History of CSS
When html was new it was more of an information outlook than flashy designs. When developers tried to make designs on a page it would be to much to upload on the internet browser. The developers needed a way to make their sites look better and boom there was CSS. As the style sheets became more popular it was realized that CSS could save you many hours of work in the long run.So now its time to learn the actual syntax behind it all.
In CSS there has to be a selector. Basically the selector is the html element or tag that you want to change . Next there are curly braces( { ). A property which is what you want to change about the selector, and finally there is a semicolon and a value enclosed in another curly brace. The value is what you want the property to do or look like. So here is what it would look like…
Selector { Property: Value }
Here is an example:
body { color: yellow}
If there are multiple words in the value syntax you must put quotes around them:
p { font-family: “times new roman”}
The final thing i will show you in this guide is that if there are more properties in the selector that you would like to change you have to seperate them with a semicolon like so:
p {text align: right; color: blue}:
CSS is a valuable and time saving way to make your websites designs. So far we have covered the syntax, and a couple more easy aspects of the coding that is invloved. I am grateful that you have taken the time to read this and i hope that you have learned something from this.
Sincerely,
Brick Bankes
Tags: CSS, html, website design