Mark's coding playground...

Font family [font-family] The property font-family is used to set a prioritized list of fonts to be used to display a given element or web page. h1 {font-family: arial, verdana, sans-serif;} h2 {font-family: "Times New Roman", serif;} Font style [font-style] The property font-style defines the chosen font either in normal, italic or oblique. h2 {font-family: "Times New Roman", serif; font-style: italic;} Font variant [font-variant] The property font-variant is used to choose between normal or small-caps variants of a font. A small-caps font is a font that uses smaller sized capitalized letters (upper case) instead of lower case letters. h1 {font-variant: small-caps;} h2 {font-variant: normal;} Font weight [font-weight] The property font-weight describes how bold or "heavy" a font should be presented. A font can either be normal or bold. h1 {font-family: arial, verdana, sans-serif; font-weight: bold;} ...

Foreground color: the 'color' property The color property describes the foreground color of an element. Sample code is given below copy and try it out... h1 { color: #990099; } h3{ color: #999999; } p { color: #990099; } 'background-color' property The background-color property describes the background color of elements. Sample code is given below copy and try it out... h1 { background-color: #990099; } h3{ background-color: #999999; } p { background-color: #990099; } Background images [background-image] The CSS property background-image is used to insert a background image. Sample code is given below copy and try it out... body { background-color: #FFCC66; background-image: url("016.jpg"); } Repeat background image [background-repeat] This property describes whether background image has to repeat or not,because if given by default it will repeat horizontally. background-repeat: repeat - image will be repea...

An external style sheet is simply a text file with the extension .css. Suppose our CSS file is inside the folder named "style" and the CSS file with file name "newstyles.css".The the code to link the html with CSS is given below .. <link rel="stylesheet" type="text/css" href="style/newstyles.css" /> The line of code must be inserted in the header section of the HTML code. And if you have to give different style to different attribute you can see the sample code below.. Get the sample source code for "test.html" which is connected to an external CSS named "newstyles.css". <html> <head> My sample document </head> <body> My first stylish header My second stylish header My paragraph </body> </html> Get the sample source code for "newstyles.css". body { background-color: #00FF00; } h1 { color: #990099; backgro...

There are three ways you can apply CSS to an HTML document. In-line (the attribute style) One way to apply CSS to HTML is by using the HTML attribute style . <html> <head> Sample </head> <body style="background-color: #00FF00;"> The background color is green </body> </html> Internal (the tag style) Another way is to include the CSS codes using the HTML tag <style>. <html> <head> <title>Example</title> <style type="text/css"> body {background-color: #00FF00;} </style> </head> <body> <p>The background color is green </p> </body> </html> External (link to a style sheet) The last method is to link to an external CSS file.An external style sheet is simply a text file with the extension .css. Suppose our CSS file is inside the folder named "style" and the CSS file with file name ...

selector { property: value; } Here, selector : Says what HTML tag does property apply to property : Says about the property or functionality applied value : Set property attributes eg : body {background-color: #00FF00;}

Cascading Style Sheets (CSS) is a fantastic tool to add layout to your websites. It can save you a lot of time and it enables you to design websites in a completely new way. CSS is a must for anyone working with web design. CSS is a style language that defines layout of HTML documents. For example, CSS covers fonts, colours, margins, lines, height, width, background images, advanced positions and many other things.CSS is supported by all browsers today. The main difference between HTML and CSS is that - HTML is used to structure content. CSS is used for formatting structured content. CSS was a revolution in the world of web design. The benefits of CSS include: control layout of many documents from one single style sheet; more precise control of layout; apply different layout to different media-types (screen, print, etc.); numerous advanced and sophisticated techniques.