Step
5: Now all that is left to do is to complete 3 pages by adding
and styling content. Create a subfolder ‘text’
within the folder called ‘Spotlite’
and click on the 'files' button or follow this
link to download the text files, 5 in total, to your text folder.
It will help if you read your
notes on inserting text files and
'cascading style sheets' before you
attempt the next step.
CSS: Create a cascading style
sheet
- Create an external style sheet and
name it spotlite.css
- Redefine the H1 and H2 heading styles
and create a new style 'spotlite' as follows:
- Save the style sheet
| H1
{
font-size: 26pt;
font-family: "Lucida Handwriting", "Lucida
Sans";
color: #FFCC00;
font-weight: bold;
text-decoration: underline;
text-align: center;
} |
H2
{ font-size: 14pt;
font-family: "Comic Sans MS";
color: #3399FF;
font-weight: bold;
} |
.spotlite
{
font-family: "Comic Sans MS";
font-size: 11px;
background-color:
#FFE88A;
border: thick groove #3399FF;
padding: 10px;
}
|
ADDING
CONTENT: Print
justrel.htm,
oldfavs.htm,
and comsoon.htm
from the browser.
- Download recentfilmanim.gif
and comingsoonanim.gif from the
files page to your images folder.
- Open justrel.htm.
- Insert recentfilmanim.gif
and a line break.
- Add the test Must
see: using Heading 1 style.
- Insert the text files,
Kong.txt, Narnia.txt and
Harry.txt.
- Attach the style sheet to the page
and apply Heading 2 style, to the
3 headings.
- Apply the spotlite
style to the 3 paragraphs.
- Save the page.
- Open comsoon.htm
and insert comingsoon anim.gif
and a line break.
- Add the test Out
2006: using Heading 1 style.
- Insert the text files,
Poseidon.txt and Panther.txt.
- Attach the style sheet to the page
and apply Heading 2 style, to the
2 headings.
- Apply the spotlite
style to the 2 paragraphs.
- Save the page.
- Download oldfavs.xls
from the files page to your spotlite folder
- Open oldfavs.htm
- Attach the style sheet, spotlite.css
to the page
- Add the test Recommended:
using Heading 1 style.
- Insert the excel file,
oldfavs.xls
- Set the height
of the table to 200 pixels, cell padding
10, cell spacing 12.
- Apply the spotlite
style
- Save the page.
Upload the 3 pages to your webspace
folder and test in the browser
|
