Scribd
Upload
48 views

CSS Revision

The document provides instructions for formatting a CSS stylesheet. Key points include: 1. Open Dreamweaver to create a new CSS stylesheet or open an existing one. 2. Add comments with your name, candidate number, and center number. 3. Set font styles for headings and paragraphs to use specific fonts, with fallbacks. 4. Format the page background with a fixed image in the top right corner and a specific hex color.

Uploaded by

icedgoblin
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
48 views

CSS Revision

The document provides instructions for formatting a CSS stylesheet. Key points include: 1. Open Dreamweaver to create a new CSS stylesheet or open an existing one. 2. Add comments with your name, candidate number, and center number. 3. Set font styles for headings and paragraphs to use specific fonts, with fallbacks. 4. Format the page background with a fixed image in the top right corner and a specific hex color.

Uploaded by

icedgoblin
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

CSS Revision

1. To create a new stylesheet


Open dreamweaverFileNewCSS

2. To open a given stylesheet


Open the folderright click on the given stylesheetopen with
dreamweaver

3. To add your name, center number & candidate number as a comment


/* name, BH002, 0001*/

4. Set the font for styles h1, h2 , h3 and paragraph so that the browser selects
and displays the font Casion Pro Bold. If this font is not available, the
browser selects and displays the font Times New Roman. If neither of these
fonts are available, the browser should display its default serif font
h1,h2,h3,p{
font-family: "Casion Pro Bold", "Times New Roman", serif;}
5 Set style h1 so the text is red, centre aligned with a 30-point font
h1{
font-size: 30pt;
color: #ff0000;
text-align: center;}

Hexadecimal color codes (RED GREEN BLUE- #rrggbb)


Red: #ff0000
Green: #00ff00
Blue: #0000ff
White: #ffffff
Black: #000000
Yellow: #ffff00
6 Set the background for the web page so that it has a colour with a:
• green component of 9f
• blue component of 25
• red component of da
Set the background for the webpage to have the image j2232logo.png
placed:
• only once
• in the top right corner
• in a fixed position so that it will not scroll with the web page
• with a width of 200 pixels
• with a height of 150 pixels
body{
background-attachment: fixed;
background-color: #da9f25;
background-image: url(j2232logo.png);
background-repeat: no-repeat;
background-position: right top;
background-position:200px 150px}
7. Set the table to 25% from the right margin of the browser window and 5%
from all other margins of the browser window.
table{
margin-top: 5%;
margin-right: 25%;
margin-bottom: 5%;
margin-left: 5%;}

8. Set the padding for all table cells to 10 pixels.


td{
padding: 10px;}

9 Set all table borders and gridlines so that they are not visible.
table,td{border:0px}
10 Set the spaces between the borders of all table elements to 10 pixels.
Or
All cell spacing within the table is set to 10 pixels
table{border-spacing:10px}

11 Set all table borders and gridlines to be:


• visible
• separated
• solid
• black
• 1 pixel wide.
table,td{border: 1px solid #000000;}
table{border-collapse:separate}

12 Centre align the table in the browser window


table{margin-left:auto; margin-right:auto}
13 Right align the table in the browser window
table{margin-left:auto}

14 Table Size: 90% of the width of the browser window


table{width:90%}

You might also like