Design Your Pages

Design Your Pages Using Inline Style : Background

by Mohann Krish
Mohann Krish Advanced  
Background

Design is, after all, a choice of colors for the background, headings or titles and font styles of text. A few attractive background images add additional appeal to the attention catching appearance of a web page.


In CSS, the five properties of background are:

Color
Image
Repeat
Attachment
Position
Background-Color
For choosing colors, you can refer to:
Color Codes

Recall the General Syntax mentioned in the Introduction:


<p style="property:value;”>YOUR TEXT HERE!</p>
Let us use the following examples:

<p style="background-color:#E6E6EE;">Your Text Here!</p>

Result:

Your Text Here!


<p style="background-color:#cbfed8 ;">Your Text Here!</p>

Result:

Your Text Here!

<p style="background-color:rgb(220,220,220);">Your Text Here!</p>

Result:

Your Text Here!

Note: Don't forget the "#" (Hash) symbol before the color code!

The other properties i.e., Image, Repeat, Attachment and Position would be explained in the advanced series.
May 30th 2011 09:11

Sponsor Ads


Comments

Julie C. Innovator   Web Marketing
Still puzzled figuring out codes to make it more understandable
julie
Jun 3rd 2011 07:41   
Mohann Krish Advanced   
Please let read the introduction page. You can come back and seek clarifications on your doubts and difficulties in understanding. These codes called CSS are used to design our pages more effectively. By the way, may I suggest to you to upload your photo!
Jun 3rd 2011 13:16   
Lenore A. Moker Advanced   
Another great site to HTML colors is http://www.w3schools.com/tags/ref_colorpicker.asp. This is the site I refer to myself for my personal blog and websites I create on the side.
Jun 6th 2011 20:01   
Chukwuekwu Okonta Professional   Forensic accountant
@Lenore,your links worked in comments , the ethics is that we should not include links in comments here in apsense. Sorry just to draw your attention to it.
Jun 28th 2011 08:56   
Chukwuekwu Okonta Professional   Forensic accountant
@mohann, after inserting < p style = " background- color: # color number;"> my text ! </a > .
My question is should i retain the word backgroud , the word color in my design, well i know i have add my text, again should i add color number and code at same time like this (a)orange=(b)255-165 /(c) ffa500
do i combine b and c or use only c for color.
Jul 4th 2011 13:52   
Mohann Krish Advanced   
'background-color' is a property and should be used as such i.e., no spelling mistake. The value can be anyone of a)green b)#00ff00 c)rgb(0,255,0). Don't combine. If there is mistake, default value is used. Try putting all and run an experiment to see what happens!
Jul 4th 2011 21:06   
You are not yet a member of this group.