web design

CSS Background Code

2012-07-13T12:15:00.000+02:00

The following CSS background codes demonstrate the various CSS properties you can use to style the background of any HTML element.

CSS Background Color

<p style="background-color:yellow;">This text has a background color applied.</p>

This results in:

This text has a background color applied.

CSS Background Image



<p style="height:100px;background-image:url(/pix/smile.gif);">This text has a background image applied. </p>

This results in:

This text has a background image applied.

CSS Background Repeat

Determines whether the background image repeats (tiles) or not. For info on the possible values, see the background-repeat page.



<p style="height:100px;background-image:url(/pix/smile.gif);background-repeat:no-repeat;">This background image does not repeat. </p>

This results in:

This background image does not repeat.

CSS Background Position

Determines the position of the background image.



<p style="height:100px;background-image:url(/pix/smile.gif);background-repeat:no-repeat;background-position:100px;">This background image is positioned 100 pixels in from the left. </p>

This results in:

This background image is positioned 100 pixels in from the left.

CSS Background Attachment

Determines whether or not the background image scrolls with the outer container.



<p style="height:100px;width:150px;overflow:scroll;background-image:url(/pix/smile.gif);background-attachment:fixed;">This background image is fixed - it doesn't scroll with its outer container. This example uses the CSS overflow property to force the box to scroll when there's too much text to fit in the box. </p>

This results in:

This background image is fixed - it doesn't scroll with its outer container. This example uses the CSS overflow property to force the box to scroll when there's too much text to fit in the box.

Shorthand Code

You can use the background property to set all the background properties at once. For example:



<p style="height:100px;width:150px;overflow:scroll;background:url(/pix/smile.gif) repeat fixed;">This paragraph tag has been styled using the 'background' property, which is shorthand for setting multiple properties for an HTML element. </p>

This results in:

This paragraph tag has been styled using the 'background' property, which is shorthand for setting multiple properties for an HTML element.

<< Previous
Next Lesson >>

CSS Text

2012-07-13T12:10:00.001+02:00

Apart from the various CSS font properties, there are other properties that can assist in styling your text. For example, you can change the color of text, align text, add decoration properties and more.

In CSS, text can be styled using the properties listed below. Using this list, you can learn how to use each css text property and what it looks like in a browser.

CSS Text Color

<p style="color:olive;">This CSS text color is olive</p>

This results in:

This CSS text color is olive

CSS Text Align

<p style="text-align:right;">This CSS text is aligned right</p>

This results in:

This CSS text is aligned right

CSS Text Indent

Indents the first line of the paragraph.



<p style="text-indent:50px;">This text is indented by 50 pixels. What this means is that the first line of the paragraph will be indented by 50 pixels, but the following lines will not be indented. The text will need to wrap before you can see the indent - hence all this text!</p>

This results in:

This text is indented by 50 pixels. What this means is that the first line of the paragraph will be indented by 50 pixels, but the following lines will not be indented. The text will need to wrap before you can see the indent - hence all this text!

CSS Letter Spacing

<p style="letter-spacing:5px;">This text has letter spacing applied</p>

This results in:

This text has letter spacing applied

CSS Word Spacing

<p style="word-spacing:50px;">This text has word spacing applied</p>

This results in:

This text has word spacing applied

CSS Text Decoration

<p style="text-decoration:overline;">This text has a line over the top</p>
<p style="text-decoration:line-through;">This text has a line through the middle</p>

<p style="text-decoration:underline;">This text has a line underneath</p>
<a style="text-decoration:none;" a href="/css/properties/css_text-decoration.cfm" >
This hyperlink has no underline</a>
<p style="text-decoration:blink;">This text is blinking</p>

This results in:

This text has a line over the top

This text has a line through the middle

This text has a line underneath

This hyperlink has no underline

This text is blinking

CSS Text Transform

<p style="text-transform:uppercase;">This text has been transformed to uppercase</p>
<p style="text-transform:lowercase;">THIS TEXT HAS BEEN TRANSFORMED TO LOWERCASE</p>
<p style="text-transform:capitalize;">this text has been capitalized.</p>

This results in:

This text has been transformed to uppercase

THIS TEXT HAS BEEN TRANSFORMED TO LOWERCASE

this text has been capitalized.

CSS Text Direction



<p style="direction:rtl;">This text is running from right to left. This can be useful for languages where the text runs from right to left. Not so useful for english though...</p>

This results in:

This text is running from right to left. This can be useful for languages where the text runs from right to left. Not so useful for english though...

CSS unicode-bidi

Use this in conjunction with the direction property to determine the direction of the text. Possible values: normal, embed, bidi-override, and inherit.



<p style="direction:rtl;unicode-bidi:bidi-override;">This text is running from right to left. This can be useful for languages where the text runs from right to left. Not so useful for english though...</p>

This results in:

This text is running from right to left. This can be useful for languages where the text runs from right to left. Not so useful for english though...

CSS Text Shadow



<p style="text-shadow:4px 4px 8px blue;">If your browser supports the CSS text-shadow property, this text will have a shadow.</p>

This results in:

If your browser supports the CSS text-shadow property, this text will have a shadow.

CSS White Space

Tells the browser how to handle white space. Possible values: normal, pre, and nowrap.

<p style="white-space:pre;">This text has a line break
and the white-space pre setting tells the browser to honor it
just like the HTML pre tag.</p>

This results in:

This text has a line break

and the white-space pre setting tells the browser to honor it

just like the HTML pre tag.

referral banners

2012-07-07T12:32:00.001+02:00

1st banner 728×90

Code

2nd
banner 468×60

Code

1st banner 120×120

Code

CSS Font

2012-07-07T12:00:00.001+02:00

CSS font properties enable you to change the look of your text. For example, you can assign a font family, apply bold or italic formatting, change the size and more.

CSS Font Family



<p style="font-family:georgia,garamond,serif;">This text is rendered in either georgia, garamond, or the default serif font (depending on which font the user's system has).</p>

This results in:

This text is rendered in either georgia, garamond, or the default serif font (depending on which font the user's system has).

CSS Font Size

Enables you to set the size of the text. For info on the possible values, see the CSS font-size page.



<p style="font-size:20px;">This text is using a font size of 20 pixels.</p>

This results in:

This text is using a font size of 20 pixels.

CSS Font Size Adjust

This property enables you to adjust the x-height to make fonts more legible. For more info, see the font-size-adjust page.



<p style="font-size-adjust:0.58;">This text is using a font-size-adjust value.</p>

This results in:

This text is using a font-size-adjust value.

CSS Font Stretch

This property relies on the user's computer to have an expanded or condensed version of the font being used. For all possible values, see the font-stretch page.



<p style="font-stretch:ultra-expanded;">If your computer has an expanded version of the font being used, this text will be stretched.</p>

This results in:

If your computer has an expanded version of the font being used, this text will be stretched.

CSS Font Style



<p style="font-style:italic;">This text is in italics.</p>

This results in:

This text is in italics.

CSS Font Variant

Enables you to set your text to use small caps.



<p style="font-variant:small-caps;">This Text Is Using Small Caps.</p>

This results in:

This Text Is Using Small Caps.

CSS Font Weight

Enables you to set your text to bold.



<p style="font-weight:bold;">This text is bold.</p>

This results in:

This text is bold.

CSS Font Property

The font property is a shorthand property that enables you to set all font properties in one go.



<p style="font:italic small-caps bold 20px georgia,garamond,serif;">The styles for this text has been specified with the 'font' shorthand property.</p>

This results in:

The styles for this text has been specified with the 'font' shorthand property.

CSS ID Syntax

2012-07-07T11:53:00.001+02:00

IDs allow you to assign a unique identifier to an HTML element. This allows you to define a style that can only be used by the element you assign the ID to.

CSS ID Syntax

The syntax for declaring a CSS ID is the same as for classes - except that instead of using a dot, you use a hash (#).

#id-name { property:value; }

Again, similar to classes, if you want to use the same id name for multiple elements, but each with a different style, you can prefix the hash with the HTML element name.

html-element-name#id-name { property:value; }

CSS ID Example

<head>
<style type="text/css">
h1#css-section { color:#000099 }
p#css-section { color:#999999; }
</style>
</head>
<body>
<h1 id="css-section">CSS ID</h1>
<p id="css-section">CSS IDs can be very useful</p>
</body>

This results in:

CSS ID

CSS IDs can be very useful

IDs vs Classes

Given classes and IDs are very similar, you may be wondering which one to use. This depends on the situation.

When to use classes

You should use classes when your style needs to be applied multiple times on the same page. For example, you might have many h1 elements that need the same style applied.

When to use IDs

You should use IDs if only one element on the page should have the style applied, and/or you need a unique identifier for that element. For example, you might assign an ID to a div tag which contains your left menu. The styles for this ID could contain the position, background-color, float properties, size etc. You probably wouldn't want any other element on the page to use this particular style.

Another useful thing about IDs is that you can use the Document Object Model (DOM) to refer to them. This enables you to use JavaScript/DHTML techniques to build a much more interactive web site.

CSS Class

2012-07-07T11:29:00.001+02:00

In CSS, classes allow you to apply a style to a given class of an element. To do this, you link the element to the style by declaring a style for the class, then assigning that class to the element.

CSS Class Syntax

You declare a CSS class by using a dot (.) followed by the class name. You make up the class name yourself. After the class name you simply enter the properties/values that you want to assign to your class.

.class-name { property:value; }

If you want to use the same class name for multiple elements, but each with a different style, you can prefix the dot with the HTML element name.

html-element-name.class-name { property:value; }

CSS Class Example

<head>
<style type="text/css">
h1.css-section { color:#000099 }
p.css-section { color:#999999; }
</style>
</head>
<body>
<h1 class="css-section">CSS Class</h1>
<p class="css-section">CSS classes can be very useful</p>
</body>

This results in:

CSS Class

CSS classes can be very useful

Cascading Rules of Classes

If you have already applied a style to an element, the element will first use those styles, then the ones defined in the class.

web design: all about google secrets

2012-07-06T11:54:00.001+02:00

web design: all about google secrets: discover what you don't know anout google this isn't a joke. Really most of us don't know much about google's benfits or even use it at the ...

Implementing CSS

2012-07-03T17:26:00.001+02:00

There are 4 ways of implementing CSS: declare inline, embed into the head of your document, link to an external CSS file, import a CSS file.

Inline CSS

Style sheet information is applied to the current element. Instead of defining the style once, then applying the style against all instances of an element (say the <P> tag), you only apply the style to the instance you want the style to apply to.

For example:


<P style="color:#ff9900">
  CSS tutorial.
</p>

Embedded CSS

You embed CSS information into an HTML document using the 'style' element. You do this by embedding the CSS information within <style>...</style> tags in the head of your document.

For example, place the following code between the <head>...</head> tags of your HTML document:


<style type="text/css" media=screen>
p {color:#ff9900;}
</style>

Now, whenever any of those elements are used within the body of the document, they will be formatted as instructed in the above style sheet.

External CSS

An external style sheet is a separate file where you can declare all the styles that you want to use throughout your website. You then link to the external style sheet from all your HTML pages. This means you only need to set the styles for each element once. If you want to update the style of your website, you only need to do it in one place.

For example:

Type the following into a plain text file, and save with a .css extension (i.e. external_style_sheet.css).
```
p {font-family: georgia, serif; font-size: x-small;}
h1 {color: #000099; }
```
Add the following between the <head>...</head> tags of all HTML documents that you want to reference the external style sheet.
```
<link rel="stylesheet" href="external_style_sheet.css" type="text/css">
```

Imported CSS

You can use the @import rule to import rules from other style sheets.

Add either of the following between the <head>...</head> tags of all HTML documents that you want to import a style sheet into.


@import "imported_style_sheet.css";
@import url("imported_style_sheet.css");

The CSS syntax

2012-07-03T17:14:00.001+02:00

The CSS syntax consists of a set of rules. These rules have 3 parts: a selector, a property, and a value.

You don't need to remember this in order to code CSS. Once you start coding CSS, you'll do so without thinking "this is a selector" or "that is a property". This should begin to make sense once you study the examples on this page.

Syntax:

selector { property: value }

The selector is often the HTML element that you want to style. For example:

h1 { color: blue }

This code tells the browser to render all occurences of the HTML h1 element in blue.

Grouping Selectors

You can apply a style to many selectors if you like. Just separate the selectors with a comma.

h1,h2,h3,h4,h5,h6 { color: blue }

Applying Multiple Properties

To apply more than one property separate each declaration with a semi-colon.

h1 { color:blue; font-family:arial,helvetica,"sans serif" }

Readability

You can make your CSS code more readable by spreading your style declarations across multiple lines. You can also indent your code if you like. This doesn't affect how your code is rendered - it just makes it easier for you to read.

h1 {
 color:blue;
 font-family:arial,helvetica,"sans serif";
 font-size:150%;
}

OK, so you've now learned about the CSS syntax. But how do you incorporate this syntax into your website? The next lesson will show you how to incorporate CSS into your HTML documents.

the advantages of CSS

2012-07-03T17:02:00.001+02:00

HTML has its limitations when it comes to layout. Sure, you have 6 different levels of headings and 6 different sizes of fonts. You also have tables, and you have control over alignment etc. These are good enough to get a reasonable looking document that shows the true structure of information. However, it's a far cry from some of the excellent layout & design that we see in magazines and printed brochures etc.

CSS helps us achieve such layouts.

With CSS, you have much better control over the layout of your web pages. You can specify exactly how big a font will be, exactly where an element will be on a page, what the page will look like when printed, and much more.

CSS can also save you a lot of time, particularly when maintaining a large site. Also, the World Wide Web Consortium (W3C) recommends that web developers use CSS tags instead of HTML tags wherever possible. The W3C are gradually phasing out quite a few of these HTML tags.

Advantages of CSS

CSS saves time
When most of us first learn HTML, we get taught to set the font face, size, colour, style etc every time it occurs on a page. This means we find ourselves typing (or copying & pasting) the same thing over and over again. With CSS, you only have to specify these details once for any element. CSS will automatically apply the specified styles whenever that element occurs.
Pages load faster
Less code means faster download times.
Easy maintenance
To change the style of an element, you only have to make an edit in one place.
Superior styles to HTML
CSS has a much wider array of attributes than HTML.

Disadvantages of CSS

Browser compatibility
Browsers have varying levels of compliance with Style Sheets. This means that some Style Sheet features are supported and some aren't. To confuse things more, some browser manufacturers decide to come up with their own proprietary tags. Fortunately, browser compatibility is becoming less of an issue as the latest browser versions are much more standards-compliant than their earlier counterparts
.

introduction to Css

2012-07-03T16:03:00.001+02:00

Cascading Style Sheets (CSS) have been seriously underated. Maybe it's because web designers think it's harder than what it is. The truth is, CSS is incredibly easy!

With CSS, you can define all your common styles in an external Style Sheet. This way, if you want to change every occurence of a style throughout your site, you only need to update one place.

This tutorial will show you how to implement CSS into your website. This tutorial will also show you how to create an external style sheet and link to it from your HTML page.

About CSS

What does CSS stand for?

CSS stands for Cascading Style Sheets.

What is CSS?

CSS is a language that you can use to define styles against any HTML element. These styles are set using CSS properties.For example, you can set font properties (size, colors, style etc), background images, border styles, and much more.

Cascading Style Sheets, level 1 (CSS1) became a W3C Recommendation in December 1996. It describes the CSS language as well as a simple visual formatting model. CSS2, which became a W3C recommendation in May 1998, builds on CSS1 and adds support for media-specific style sheets (e.g. printers and aural devices), downloadable fonts, element positioning and tables.

As of this writing, CSS3 is currently under development

Css inline style sheets

2012-06-22T13:53:00.000+02:00

Inline style sheets is a term that refers to style sheet information being applied to the current element. By this, I mean that instead of defining the style once, then applying the style against all instances of an element (say the <P> tag), you only apply the style to the instance you want the style to apply to. Actually, it's not really a style sheet as such, so a more accurate term would be inline styles.

Example

Normal HTML


<P>
   Using normal HTML (not using inline style sheets).
</p>

Using inline style sheets


<P style="font-size: x-large; color: #ff9900">
   Using inline style sheets - or is that inline styles?
</p>

Try it yourself!

Embedded style sheets codes

2012-06-22T03:09:00.039+02:00

Embedded Style Sheets refer to when you embed style sheet information into an HTML document using the style element. You do this by embedding the style sheet information within <style>...</style> tags in the head of your document.

Example

Place the following code between the <head>...</head> tags of your HTML document:


<style type="text/css" media=screen>
<!--
   p {font-family: georgia, serif; font-size: x-small;}
   hr {color: #ff9900; height: 1px }
   a:hover {color: #ff0000; text-decoration: none}
-->
</style>

Now, whenever any of those elements are used within the body of the document, they will be formatted as instructed in the above style sheet.

Try it yourself !

Embedded style sheets are suited for documents with unique design requirements. If the styles need to be applied across muliple documents, you should link to an external style sheet instead of using an embedded style sheet.

CSS text-align

2012-06-21T18:37:00.002+02:00

.HTML ALIGN is known and familiar to all as you can align elements horizontally or vertically

but There isn't actually a CSS ALIGN or CSS VALIGN property. Instead, CSS has the text-align which applies to inline content of block-level elements, and vertical-align property which applies to inline level and table cells.

CSS text-align example

td { text-align: right }

The css text-align property applies to the contents of the block-level element - it doesn't need to be text. For more information on usage, see the text-align property page.

CSS vertical-align example

td { vertical-align: text-top }

Note that at the time of writing, browser support for vertical-align was limited. For more information on usage, see the vertical-align property pag

HTML table code

2012-03-26T17:37:00.001+02:00

This page contains HTML table code - HTML codes for specifying or changing the look of your tables within your blog or web page.

HTML tables are created using the HTML table tag along with other tags that are nested inside it. The look and style of your tables is defined using Cascading Style Sheets (CSS).

Here, you can find heaps of examples that demonstrate how you can change the look of your tables.

Table Text

Example:

Table header	Table header
Table cell 1	Table cell 2
Table cell 3	Table cell 4

Get Code

Table Borders

Example:

Table header	Table header
Table cell 1	Table cell 2
Table cell 3	Table cell 4

Get Code

Table Background Color

Example:

Table header	Table header
Table cell 1	Table cell 2
Table cell 3	Table cell 4

Get Code

Table Background Image

Example:

Table header	Table header
Table cell 1	Table cell 2
Table cell 3	Table cell 4

Get Code

HTML table text code

2012-03-26T17:36:00.000+02:00

This page contains HTML table text code. This code enables you to format the text inside your HTML tables. For example, you can change the text color, size, style, alignment etc.

Example

In the following example, we use a CSS class to format the table text. We can use child selectors to format the table cells too if required.

In this example, we use the color property to define the text color. We use the font property to define the font weight, style, size, line height, and font family. We apply these properties to various HTML elements including the table, table header, table cells, as well as any hyperlinks within the table. And we use pseudo classes such as a:hover, a:active and a:visited to define the styles for the hyperlinks.

Example:

My Table Text

Header 1	Header 2	Header 3
Table text is formatted using Cascading Style Sheets (CSS). CSS provides many properties that allow you to format your text.	Table text is formatted using Cascading Style Sheets (CSS). CSS provides many properties that allow you to format your text.	Table text is formatted using Cascading Style Sheets (CSS). CSS provides many properties that allow you to format your text.
Table text is formatted using Cascading Style Sheets (CSS). CSS provides many properties that allow you to format your text.	Table text is formatted using Cascading Style Sheets (CSS). CSS provides many properties that allow you to format your text.	Table text is formatted using Cascading Style Sheets (CSS). CSS provides many properties that allow you to format your text.

HTML Code:

<html> <head> <title>My  Table Text</title> <style type="text/css"> .myTableText {  width:600px;border-collapse:collapse;background-color:#98FB98; } .myTableText td, .myTableText th { border:2px solid #47ae32;padding:5px;  } .myTableText th { font:bold 18px/1.1em Arial, Helvetica,  sans-serif;text-shadow: 1px 1px 4px black; letter-spacing:0.2em;  background-color:#47ae32; color:#98FB98; } .myTableText td { font:normal 14px/1.5em Goudy, Georgia,  serif;color:#47ae32; } .myTableText td a { color:#006400;text-decoration:none; } .myTableText td a:hover { color:#FF4500;text-decoration:underline; } .myTableText td a:visited { color:#006400; } </style> </head> <body> <table class="myTableText"> <tr> <th>Header 1</th><th>Header  2</th><th>Header 3</th> </tr> <tr> <td>Table text is formatted using <a href="/css/">Cascading  Style Sheets</a> (CSS). CSS provides many <a  href="/css/properties/">properties</a> that allow you to format  your text.</td> <td>Table text is formatted using <a href="/css/">Cascading  Style Sheets</a> (CSS). CSS provides many <a  href="/css/properties/">properties</a> that allow you to format  your text.</td> <td>Table text is formatted using <a href="/css/">Cascading  Style Sheets</a> (CSS). CSS provides many <a  href="/css/properties/">properties</a> that allow you to format  your text.</td> </tr> <tr> <td>Table text is formatted using <a href="/css/">Cascading  Style Sheets</a> (CSS). CSS provides many <a  href="/css/properties/">properties</a> that allow you to format  your text.</td> <td>Table text is formatted using <a href="/css/">Cascading  Style Sheets</a> (CSS). CSS provides many <a  href="/css/properties/">properties</a> that allow you to format  your text.</td> <td>Table text is formatted using <a href="/css/">Cascading  Style Sheets</a> (CSS). CSS provides many <a  href="/css/properties/">properties</a> that allow you to format  your text.</td> </tr> </table> </body> </html>

Using External Style Sheets

The above example uses embedded style sheets to set the CSS properties. This is because it's easier for demonstration purposes. I strongly encourage you to use an external style sheet whenever possible to set your styles. This can reduce coding time and make your code easier to maintain.

HTML table background color code

2012-03-26T17:27:00.000+02:00

This page contains HTML table background color code. These are HTML codes for specifying or changing the background color of your tables within your blog or web page.

In HTML, table background color is specified using Cascading Style Sheets (CSS). In particular, you use the CSS background-color property to set the background color for your table. You can also specify a separate background color for your table rows and table cells if you like.

Background Color for the Whole Table

To change the background color of the whole table, use the background-color property against the table tag.

Example:

Table header	Table header
Table cell 1	Table cell 2

HTML Code:

<table style="background-color:lightblue;"> <tr> <th>Table header</th><th>Table header</th> </tr> <tr> <td width="20%">Table cell 1</td><td>Table cell 2</td> </tr> </table>

Background Color of a Table Row

To change the background color of a table row, you apply the same code, but to the table row in question (i.e. the tr tag).

Example:

Table header	Table header
Table cell 1	Table cell 2

HTML Code:

<table style="background-color:lightblue;"> <tr style="background-color:blue;color:white;"> <th>Table header</th><th>Table header</th> </tr> <tr> <td>Table cell 1</td><td>Table cell 2</td> </tr> </table>

Background Color of a Single Cell

To change the background color of a single table cell, you apply the same code, but to the table cell in question (i.e. the td tag or the th tag, depending on whether the cell is a normal table data row or part of a table header).

Example:

Table header	Table header
Table cell 1	Table cell 2

HTML Code:

<table style="background-color:lightblue;"> <tr style="background-color:blue;color:white;"> <th>Table header</th><th>Table header</th> </tr> <tr> <td>Table cell 1</td><td style="background-color:lightgreen;">Table cell 2</td> </tr> </table>

Using Classes

The above examples use inline style sheets to set the CSS properties. This is only because it makes it easier for demonstration purposes. I strongly encourage you to use a CSS class defined in an external style sheet to set your styles. Even embedded style sheets are usually better than inline.

Here's an example of setting the table's background color and other properties using a CSS class.

Example:

Table header	Table header
Table cell 1	Table cell 2

HTML Code:

a brief introduction to java script

2011-11-29T06:54:00.000+02:00

java scripts lessons

Unless you don't know a lot about programming and scripting , you will be confused because it is different from using HTML codes . I advise you to spend some time to cover information about it . follow our lessons to learn more about programming and scripting. To begin book mark this tutorial to help you in your study.

Java script simply is a scripting language that enables web developers and designers to build more functional and interactive websites.

There are many effective common uses of java scripts for example:

Alert messages
Popup windows
Dynamic dropdown menus
Form validation
Displaying date/time

Java scripts : depend on the browser not the client, mainly it loads directly on the browses sides, so you may need to refresh the page to run the script again .

To create a java script you need some tools mainly to have a computer , editors as ( text editor, web browser as firefox or internet explorer, and enabled java script on your browser)

Our lesson ended , the next lesson will explain how to enable/ disable java script on your browser. Bye for now .

modify the background of your HTML tables.

2011-11-20T00:01:00.000+02:00

HTML table background code. This code enables you to modify the background of
your HTML tables. For example, you can change the background color or add a
background image to your tables.

Setting All Background Styles

There is a shorthand CSS property that allows you to set all your background
styles in one go. This property is the



background

property.

This is the property that most web developers use for setting their table
backgrounds, as it's quicker to use and it helps to minimize code. This property
allows you to set the background color and a background image properties using
one property. You can see it in action with the following example.

If you have difficulty understanding this property, have a look at the other
examples on this page. They should make things a bit clearer for you.

Example:

Table header	Table header	Table header
design	4webs	free html codes
free design	web design	all free

HTML Code:

<html><br /> <head><br /> <title>My<br />  Table and It's Background Image</title><br /> <style type="text/css"><br /> .myTableBg { width:400px;background:#dedede <br /> url(/pix/web_graphics/free_website_graphics/background_patterns/101Emboss8.gif)<br />  repeat;border-collapse:collapse; }<br /> .myTableBg td, .myTableBg th { border:2px solid white;padding:5px; }<br /> </style><br /> </head><br /> <body><br /> <table class="myTableBg"><br /> <tr><br /> <th>Table header</th><th>Table <br /> header</th><th>Table header</th><br /> </tr><br /> <tr><br /> <td>design</td><td>Table cell <br /> 2</td><td>free html codes</td><br /> </tr><br /> <tr><br /> <td>free design</td><td>Table cell <br /> 5</td><td>all free</td><br /> </tr><br /> </table><br /> </body><br /> </html><br />

Background Color

The following example demonstrates how background color can be applied to the
table, a table row, and also an individual table cell by using the



background-color

property. Check out

HTML Table Background Color to see more examples of adding background color
to a table. In particular, it shows how to use a
CSS class to
define your table styles.

Example:

Table header	Table header
design	4webs

HTML Code:

<table style="background-color:lightblue;"><br /> <tr style="background-color:blue;color:white;"><br /> <th>Table header</th><th>Table header</th><br /> </tr><br /> <tr><br /> <td width="20%">design</td><td style="background-color:lightgreen;">4webs</td><br /> </tr><br /> </table><br />

Table Background Image

Here's an example of adding a background image to your table by using the CSS



background-image

property.

The background image in this example automatically repeats across the full
width and height of the table. In other words, if the background image is
smaller than the table, it will be displayed again and again until it reaches
the edge of the table.

Here's the actual image that we will use in the following example:

As you can see, this image is smaller than the width of the table, so it
repeated across the full width and height of the table.

In this example, we also add a thin border to our table. Here's more about
HTML
table borders.

Table header	Table header
design	4webs

HTML Code:

<table<br />  <br /> style="background-image:url(/pix/web_graphics/free_website_graphics/background_patterns/ac643.gif);border:1px<br />  solid black;"><br /> <tr><br /> <th>Table header</th><th>Table header</th><br /> </tr><br /> <tr><br /> <td>design</td><td>4webs</td><br /> </tr><br /> </table><br />

Non-Repeating Background Image

Sometimes you might not want the background image to repeat. Sometimes you
might want it to appear once only. For this effect, you can use the CSS

background-repeat property. You can also use the

background-position property to define where the image is positioned within
the table. For example, you could position the image in the center of the table,
or at the top-left or bottom-right etc.

Table header	Table header
design	4webs
free html codes	free design
web design	all free

HTML Code:

<table<br />  <br /> style="background-image:url(/pix/web_graphics/free_website_graphics/background_patterns/101celebrate3.gif);background-repeat:no-repeat;background-position:center<br />  center;border:1px solid black;width:200px;height:200px;"><br /> <tr><br /> <th>Table header</th><th>Table header</th><br /> </tr><br /> <tr><br /> <td>design</td><td>4webs</td><br /> </tr><br /> <tr><br /> <td>free html codes</td><td>free design</td><br /> </tr><br /> <tr><br /> <td>web design</td><td>all free</td><br /> </tr><br /> </table><br />

Background Image on Table Cells

You could also add a background image to each individual table cell. You
could use a different image for each cell or the same image. If you use the same
image, it would give it that "repeat" effect and the "repeat" could be precisely
aligned with each table cell (but it doesn't have to be). You could also achieve
this effect using a repeating background image on the whole table, but you'd
need to ensure that each cell is exactly the same size as the image, and you
might need to play around with the
table
border.

Here's an example of adding a background image to each cell using a
CSS class with
an embedded style
sheet:

Table header	Table header	Table header
design	4webs	free html codes
free design	web design	all free

HTML Code:

<html><br /> <head><br /> <title>My<br />  Table Cells and Their Background Images</title><br /> <style type="text/css"><br /> .cellImage td, .cellImage th { <br /> background-image:url(/pix/web_graphics/free_website_graphics/background_patterns/101Emboss8.gif);width:120px;height:70px;padding:5px;<br />  }<br /> </style><br /> </head><br /> <body><br /> <table class="cellImage"><br /> <tr><br /> <th>Table header</th><th>Table <br /> header</th><th>Table header</th><br /> </tr><br /> <tr><br /> <td>design</td><td>Table cell <br /> 2</td><td>free html codes</td><br /> </tr><br /> <tr><br /> <td>free design</td><td>Table cell <br /> 5</td><td>all free</td><br /> </tr><br /> </table><br /> </body><br /> </html><br />

Using Classes

Some of the above examples use
inline style sheets
and the others use
embedded style
sheets to set the CSS properties. This is because it's easier for
demonstration purposes. I strongly encourage you to use a
CSS class
defined in an
external style sheet whenever possible to set your styles. This can reduce
coding time and make your code easier to maintain.

&lt;p&gt;&amp;amp;amp;amp;lt;p&amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;lt;br /&amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;lt;/p&amp;amp;amp;amp;gt;&lt;/p&gt;

all about google secrets

2011-11-17T03:25:00.000+02:00

discover what you don't know anout google this isn't a joke. Really most of us don't know much about google's benfits or even use it at the right and quickest way to get our needs from it. in this section you wil discover all about google's benfits and tricks, just go to this link and download the file .

download now

for arabic this video will help all my fans and reader to

download this viedo now

all you need about HTML Color

2011-11-16T18:43:00.000+02:00

all you need about HTML Color

This page contains various HTML color codes - HTML codes for applying color
to your web page or MySpace page. There are literally millions of different HTML
color combinations that you can apply to your website. 16,777,216 colors
to be exact! These range from simple, name-based colors such as "red" or
"white", to more advanced color definitions such as "#ff0000".

Here, you will find links to copy/paste codes, as well as tutorials that
explain HTML color in more detail.

Color Text

Blue color font
Green color text
Orange color font
Red color text

Get Code

Background Color

Background

Color

Get Code

Form Color

Get Code
Scrollbox Colors

Border Color

Create a color border around your HTML elements.

Get Code
comment color box

Color Names

This color table represents the 17 official color names as recognized by
the CSS 2.1 specification. You can use either the color name or its
corresponding hex value within your HTML.

maroon #800000

red #ff0000

orange #ffA500

yellow #ffff00

olive #808000

purple #800080

fuchsia #ff00ff

white #ffffff

lime #00ff00

green #008000

navy #000080

blue #0000ff

aqua #00ffff

teal #008080

black #000000

silver #c0c0c0

gray #808080

View More Color Names

This page contains HTML color names. These are color names that can be used
when coding HTML and CSS. The first table contains the 17 color names as
recognized by the CSS 2.1 specification. The second table contains a more
extensive list of color names. These are known as X11 color names, and were
standardized by SVG 1.0.

Basic Color Names

HTML officially recognizes 17 color names. To clarify, there are 17 color
names specified in the CSS 2.1 specification. The color names in the following
table are the HTML color names as recognized by the CSS 2.1 specification.

Color Name	Hex Code RGB	Decimal Code RGB
Maroon	`800000`	`12800`
Red	`ff0000`	`25500`
Orange	`ffA500`	`2551650`
Yellow	`ffff00`	`2552550`
Olive	`808000`	`1281280`
Green	`008000`	`01280`

Color Name	Hex Code RGB	Decimal Code RGB
Purple	`800080`	`1280128`
Fuchsia	`ff00ff`	`2550255`
Lime	`00ff00`	`02550`
Teal	`008080`	`0128128`
Aqua	`00ffff`	`0255255`
Blue	`0000ff`	`00255`

Color Name	Hex Code RGB	Decimal Code RGB
Navy	`000080`	`00128`
Black	`000000`	`000`
Gray	`808080`	`128128128`
Silver	`c0c0c0`	`192192192`
White	`ffffff`	`255255255`
Black	`000000`	`000`

X11 Color Names

The following table contains the color names that are recognized by most, if
not all, modern browsers. Most of these are from the list of X11 color names
distributed with the X Window System. These color names were standardized by SVG
1.0.

Color Name	Hex Code RGB	Decimal Code RGB
Reds
IndianRed	`CD5C5C`	`2059292`
LightCoral	`F08080`	`240128128`
Salmon	`FA8072`	`250128114`
DarkSalmon	`E9967A`	`233150122`
LightSalmon	`FFA07A`	`255160122`
Crimson	`DC143C`	`2202060`
Red	`FF0000`	`25500`
FireBrick	`B22222`	`1783434`
DarkRed	`8B0000`	`13900`
Pinks
Pink	`FFC0CB`	`255192203`
LightPink	`FFB6C1`	`255182193`
HotPink	`FF69B4`	`255105180`
DeepPink	`FF1493`	`25520147`
MediumVioletRed	`C71585`	`19921133`
PaleVioletRed	`DB7093`	`219112147`
Oranges
LightSalmon	`FFA07A`	`255160122`
Coral	`FF7F50`	`25512780`
Tomato	`FF6347`	`2559971`
OrangeRed	`FF4500`	`255690`
DarkOrange	`FF8C00`	`2551400`
Orange	`FFA500`	`2551650`
Yellows
Gold	`FFD700`	`2552150`
Yellow	`FFFF00`	`2552550`
LightYellow	`FFFFE0`	`255255224`
LemonChiffon	`FFFACD`	`255250205`
LightGoldenrodYellow	`FAFAD2`	`250250210`
PapayaWhip	`FFEFD5`	`255239213`
Moccasin	`FFE4B5`	`255228181`
PeachPuff	`FFDAB9`	`255218185`
PaleGoldenrod	`EEE8AA`	`238232170`
Khaki	`F0E68C`	`240230140`
DarkKhaki	`BDB76B`	`189183107`
Purples
Lavender	`E6E6FA`	`230230250`
Thistle	`D8BFD8`	`216191216`
Plum	`DDA0DD`	`221160221`
Violet	`EE82EE`	`238130238`
Orchid	`DA70D6`	`218112214`
Fuchsia	`FF00FF`	`2550255`
Magenta	`FF00FF`	`2550255`
MediumOrchid	`BA55D3`	`18685211`
MediumPurple	`9370DB`	`147112219`
Amethyst	`9966CC`	`153102204`
BlueViolet	`8A2BE2`	`13843226`
DarkViolet	`9400D3`	`1480211`
DarkOrchid	`9932CC`	`15350204`
DarkMagenta	`8B008B`	`1390139`
Purple	`800080`	`1280128`
Indigo	`4B0082`	`750130`
SlateBlue	`6A5ACD`	`10690205`
DarkSlateBlue	`483D8B`	`7261139`
MediumSlateBlue	`7B68EE`	`123104238`

Color Name	Hex Code RGB	Decimal Code RGB
Greens
GreenYellow	`ADFF2F`	`17325547`
Chartreuse	`7FFF00`	`1272550`
LawnGreen	`7CFC00`	`1242520`
Lime	`00FF00`	`02550`
LimeGreen	`32CD32`	`5020550`
PaleGreen	`98FB98`	`152251152`
LightGreen	`90EE90`	`144238144`
MediumSpringGreen	`00FA9A`	`0250154`
SpringGreen	`00FF7F`	`0255127`
MediumSeaGreen	`3CB371`	`60179113`
SeaGreen	`2E8B57`	`4613987`
ForestGreen	`228B22`	`3413934`
Green	`008000`	`01280`
DarkGreen	`006400`	`01000`
YellowGreen	`9ACD32`	`15420550`
OliveDrab	`6B8E23`	`10714235`
Olive	`808000`	`1281280`
DarkOliveGreen	`556B2F`	`8510747`
MediumAquamarine	`66CDAA`	`102205170`
DarkSeaGreen	`8FBC8F`	`143188143`
LightSeaGreen	`20B2AA`	`32178170`
DarkCyan	`008B8B`	`0139139`
Teal	`008080`	`0128128`
Blues/Cyans
Aqua	`00FFFF`	`0255255`
Cyan	`00FFFF`	`0255255`
LightCyan	`E0FFFF`	`224255255`
PaleTurquoise	`AFEEEE`	`175238238`
Aquamarine	`7FFFD4`	`127255212`
Turquoise	`40E0D0`	`64224208`
MediumTurquoise	`48D1CC`	`72209204`
DarkTurquoise	`00CED1`	`0206209`
CadetBlue	`5F9EA0`	`95158160`
SteelBlue	`4682B4`	`70130180`
LightSteelBlue	`B0C4DE`	`176196222`
PowderBlue	`B0E0E6`	`176224230`
LightBlue	`ADD8E6`	`173216230`
SkyBlue	`87CEEB`	`135206235`
LightSkyBlue	`87CEFA`	`135206250`
DeepSkyBlue	`00BFFF`	`0191255`
DodgerBlue	`1E90FF`	`30144255`
CornflowerBlue	`6495ED`	`100149237`
MediumSlateBlue	`7B68EE`	`123104238`
RoyalBlue	`4169E1`	`65105225`
Blue	`0000FF`	`00255`
MediumBlue	`0000CD`	`00205`
DarkBlue	`00008B`	`00139`
Navy	`000080`	`00128`
MidnightBlue	`191970`	`2525112`

Color Name	Hex Code RGB	Decimal Code RGB
Browns
Cornsilk	`FFF8DC`	`255248220`
BlanchedAlmond	`FFEBCD`	`255235205`
Bisque	`FFE4C4`	`255228196`
NavajoWhite	`FFDEAD`	`255222173`
Wheat	`F5DEB3`	`245222179`
BurlyWood	`DEB887`	`222184135`
Tan	`D2B48C`	`210180140`
RosyBrown	`BC8F8F`	`188143143`
SandyBrown	`F4A460`	`24416496`
Goldenrod	`DAA520`	`21816532`
DarkGoldenrod	`B8860B`	`18413411`
Peru	`CD853F`	`20513363`
Chocolate	`D2691E`	`21010530`
SaddleBrown	`8B4513`	`1396919`
Sienna	`A0522D`	`1608245`
Brown	`A52A2A`	`1654242`
Maroon	`800000`	`12800`
Whites
White	`FFFFFF`	`255255255`
Snow	`FFFAFA`	`255250250`
Honeydew	`F0FFF0`	`240255240`
MintCream	`F5FFFA`	`245255250`
Azure	`F0FFFF`	`240255255`
AliceBlue	`F0F8FF`	`240248255`
GhostWhite	`F8F8FF`	`248248255`
WhiteSmoke	`F5F5F5`	`245245245`
Seashell	`FFF5EE`	`255245238`
Beige	`F5F5DC`	`245245220`
OldLace	`FDF5E6`	`253245230`
FloralWhite	`FFFAF0`	`255250240`
Ivory	`FFFFF0`	`255255240`
AntiqueWhite	`FAEBD7`	`250235215`
Linen	`FAF0E6`	`250240230`
LavenderBlush	`FFF0F5`	`255240245`
MistyRose	`FFE4E1`	`255228225`
Greys
Gainsboro	`DCDCDC`	`220220220`
LightGrey	`D3D3D3`	`211211211`
Silver	`C0C0C0`	`192192192`
DarkGray	`A9A9A9`	`169169169`
Gray	`808080`	`128128128`
DimGray	`696969`	`105105105`
LightSlateGray	`778899`	`119136153`
SlateGray	`708090`	`112128144`
DarkSlateGray	`2F4F4F`	`477979`
Black	`000000`	`000`

free HTML Picture Codes

2011-11-16T04:19:00.000+02:00

Welcome to the fifth lesson from the lessons of HTML. In this lesson I will talk about the pictures, graphics, and dealing with them, in addition to the definition of the types of graphic files in internet slang.

I only talk about the pictures until now to add backgrounds to pages, and that was in the second lesson the inclusion of images within the same page he is another story, I begin strict moral code with you now.

The tag used to identify the main image on the page is <IMG> a single tag. But is this enough to insert a picture? No, of course, we must identify the image that we want. So we add a property to locate the SRC and the name of the image.

The following image thedome.jpg her name and when you inserted. The code for this is

You can use the following HTML code to embed a picture into your HTML document. The code uses the <img> tag, which is the official tag to use for embedding pictures on web pages.

Example Picture Code

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMmsHAzhRpsPgatn4L2nBjAMJ57NYWOM1GZNIm0aRouzRdQsZadQ1O3XcNRjYvvKe3DSjpiDXjGF82kcCkY9onZ1SllhGLwDaVfpjRuEejckTMhHA-zNO3zccxImrzeQJ6K5wt9omsQQQ/h80/a3dufc.gif" width="225" height="151" alt="Milford Sound in New Zealand" /><br />

This code results in:

More Picture Codes

Here are links to more picture codes. You can do things like hyperlink images or add a border around your picture. You can even create a rollover effect whenever you hover over the image.

Image Links - Opens a web page whenever the user clicks on your picture.
Image Maps - These are "clickable" hotspots on your image. One picture can link to many different web pages.
Picture Borders - Adds a border around your picture.
Image Rollovers - Creates that "Hover over" effect. Easier than you might think!

Picture Code Template

You can use the following template as a basis for your HTML picture codes. Simply fill in the blanks or remove uneeded attributes.

For an explanation of all the attributes, see the HTML img tag specifications.

<img src=""
 width=""
 height=""
 border=""
 alt=""
 class=""
 id=""
 title=""
 style=""
 dir=""
 lang=""
 ismap=""
 usemap=""
 align=""
 hspace=""
 vspace=""
 onclick=""
 ondbclick=""
 onmousedown=""
 onmouseup=""
 onmouseover=""
 onmousemove=""
 onmouseout=""
 onkeypress=""
 onkeydown=""
 onkeyup="" />

study and produce images borders diferent HTML codes easily

2011-11-13T22:48:00.000+02:00

To begin we show know what's borders : A border is a decorative frame that surrounds a page or elements on a page. The border can be a simple rule line or an elaborate set of lines and curves. A border can be composed of repeating graphic elements. Borders can be used to set apart, draw attention, or unify disparate elements.

To change the appearance of image borders, you need to use CSS (Cascading
Style Sheets). You can include CSS in your images using the style
attribute of the HTML
img tag. You can
use the HTML code on this page to determine image borders within your HTML
document.

Below are some examples of what you can do with HTML image borders using CSS.

Solid Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:1px solid black;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Dotted Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:2px dotted #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Grooved Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:6px groove #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Double Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:6px double #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Thick Solid Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:60px solid #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Outset Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:6px outset #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Inset Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:6px inset #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Ridged Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:6px ridge #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Dashed Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img style="border:6px dashed #545565;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

Mixed Border

<!--<br />  HTML codes by Design4Webs.blogspot.com --><br /> <img <br /> style="border-width:10px;border-color:#545565;border-style:dotted dashed<br />  solid double;" <br /> src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV8jmf7tw2iblG21YV0OXDEnZ078AZ0e0jHwLhwiVQuaJ4OKdPlVfZIfjIAR73w8HjWF__hbvUCjw1U1wRo71Jz0KbEtBqGEJuRcCvyThjugeaiNh79CNxQQw5j8y-OWZlhsXCMHHaMgc/h80/Copy+of+AquaRoom.bmp" <br /> width="225" height="151" alt="Milford Sound in New Zealand" /><br /> <p style="font-size:10px;"><a <br /> href="http://design4webs.blogspot.com/p/html.html">HTML <br /> lessons</a></p><br />

This code results in:

The above code uses the CSS
border
property which is shorthand for the various border properties (such as
border-style, border-color etc. For more info, check out the various border
properties on the CSS Properties
list

Do you enjoy our blog ? if so promote our website

2011-11-13T12:52:00.000+02:00

1st banner 728×90

Code

2nd
banner 468×60

Code

1st banner 120×120

Code

the first lesson is about HTML Text

2011-11-12T22:07:00.000+02:00

HTML Text

Our first lesson will be about text codes and their effects. We will explain how to enrich your site with text coes . Enjoy the lesson and don't forget to tell us your impression about this essay and about the our website.

At This page you will find various HTML text codes - HTML codes for text effects. There are hundreds, or even thousands, of different effects combinations that you can apply to text with HTML. These range from simple effects like changing the color, to more advanced effects such as falling text and scrolling text. There is also HTML code for making text boxes, scroll boxes, comment boxes, and more.

Basic Text Formatting

Small font
Large font
Colored font
Bold font
Italic font and more...

Get Code

CSS Text Formatting

CSS text

formatting!

Get Code

Lists

HTML Tutorial
HTML Codes
HTML Examples
and much more!

Get Code

Scrolling Text

HTML Scrolling Text!

Get Code

Text Boxes

HTML Entities

→
♣
☆
♥
♠
♦
★

...............

Get Code