July 18th, 2010
For more of this visit this link LAYOUTS Layout Galaby Alessandro Fulciniti - a collection of 40 CSS layouts based on the same markup and ready for download! Look Ma, No Tables.CSS Layout Techniques: for Fun and Profit ThreeColumnLayoutscss-discuss - Bob Easton Open Source Web DesignDownload and upload free web designs Open Web DesignDownload and upload free web designs Sample CSS Page LayoutsHere are a range of CSS page layouts, including 2 column and 3 column layouts - free to use and abuse as needed Yet Another Multicolumn LayoutA multi-column layout CSS LayoutsStu Nicholls - Three columns, CSS frame, “Fixed”, Cross browser… Read More...
Tags: best, Tools, Tutorials
Posted in CSS Articles |
No Comments »
April 1st, 2010
Setting Up the HTML Code
The HTML code for this css tutorial contains three paragraphs of text as shown below. The contents of these paragraphs are wrapped inside <font> elements. The first paragraph has been set to a larger font size. It has also been colored red and style bold and italic.
<p align="center">
<font size="4" color="#990000" face="times, times new roman">
<b><i>Example of Text Style with CSS</i></b>
</font>
</p><p>
<font size="2" face="arial, helvetica">
Here is another paragraph using inline css
</font>
</p>
<p>
<font size="2" face="arial, helvetica">
Here is third paragraph using inline css
</font>
</p>
<p>
<font size="2" face="arial, helvetica">
inline css can be fun Read More...
Tags: color, CSS, css tutorial, font-family, font-size, font-style, font-weight, How To, line-height, text-align, tutorial, Tutorials
Posted in CSS Formatting Text |
2 Comments »
February 3rd, 2010
Padding can be applied to the outside edges of the content are of any block level or inline element. Padding creates the space between the edge of the element and its content.
Like margins, padding can be applied to individual sides of a box:
p {padding: 10px;}
h1{padding-top: 0px;}
h2{padding-right: 0px;}
h3{padding-left: 0px;}
h4{padding-bottom: 0px;}
Padding can also be applied using a single shorthand property Read More...
Tags: CSS, How To, padding, Tutorials
Posted in CSS Box Model |
No Comments »
January 22nd, 2010
CSS 3.0 has a great new features called RGBa.
You can now make a transparent background, transparent text, or just about anything else transparent with RGBa.
.myClass {
background-color:rgba(255,255,255,0.5)
}
The above tag will color your area with a white background that is 50% transparent. The only issue with RGBa at this time is that IE doesn't support it Read More...
Tags: background, background-color, background-image, background-image property, CSS, How To, id, RGBa, selectors, transparent, Tutorials
Posted in Uncategorized |
1 Comment »
December 16th, 2009
When designing a CSS based website it is very useful to understand Margins. I have found that it is much easier to deal with browser compatibility when one uses proper margin styles. Trying to set a top: -10px seems to cause browser issues that can be easily avoided by using margin-top:-10px.
Margins can be applied to the outside of any block level or inline element Read More...
Tags: box model, CSS, element, How To, margin, margins, short-tag, style, styles, tutorial, Tutorials
Posted in CSS Box Model |
1 Comment »
October 3rd, 2009
The content are of a box can be given width, height, and color. Width and height can be specified in points (equal to 1/72 of an inch), picas (equal to 12 points), pixels, ems, exes, millimeters, centimeters, inches, or percents.
p { width: 100pt ;}
p { width: 20pc;}
p { width: 300px;}
p { width: 40em;}
p { width: 50ex;}
p { width: 600mm;}
p { width: 8in;}
p { width: 50%;}
The color property can be used to style the text color Read More...
Tags: class, color, content, CSS, How To, id, padding, selectors, Tutorials, width
Posted in CSS Box Model |
No Comments »
August 26th, 2009
The border properties specify the width, color and style of the border of an element. Shorthand border properties include border-top, border-bottom, border-right, border-left and border.
p {border-top: 1px solid red}
p {border-right: 2px solid blue}
p {border-bottom: 1px solid red}
p {border-top: 2px solid black}
h1 {border: 1px solid black}
Tags: borders, CSS, How To, padding, Tutorials
Posted in CSS Box Model |
No Comments »
August 24th, 2009
Padding can be applied to the outside edges of the content area of any block level or inline element. Padding creates the space between the edge of the element and its content.
Like margins, padding can be applied to individual sides of a box.
p {padding: 10px}
h1 {padding-top:0px}
h2 {padding-right:5px}
h2 {padding-bottom:7px}
h3 {padding-left:10px}
Padding can alse be applied using a single shorthand property Read More...
Tags: class, CSS, div, h1, h2, How To, margin, padding, Tutorials
Posted in CSS Block Quote |
No Comments »
August 23rd, 2009
The background-color property sets the background color of an element.
The backgound-image property applies a background image to an element, which will appear on top of any background-color.
body {
background-color:#000
}
h1 {
background-image:url(header.png);
}
Tags: background, class, CSS, div, h1, h2, How To, image, margin, Tutorials
Posted in CSS Adding Background Images |
No Comments »
August 19th, 2009
Margins can be applied to the outside of any block level or inline element. They create space between the edge of an element and the edge of any adjacent elements.
Margins can be applied to individual sides of a box:
p { margin-top: 0;}
p { margin-right: -5px;}
p { margin-bottom: 10px;}
p { margin-left: 5px;}
Margins can also be applied using a single shorthand property Read More...
Tags: CSS, div, How To, margin, margins, style, Tutorials
Posted in CSS Box Model |
No Comments »
Home
