Home	Excel	Access
\| Simple WebPages \| Formatted WebPages \|

An example of a Cascading Style Sheet

Controlling the appearance of your own web pages

Cascading style sheets (CSS) can be used to determine the appearance of HTML commands such as headings, paragraphs and tables. They are not complicated and there is plenty of help available on the internet. Nevertheless, producing a working example can involve some trial and error.

This page may help those who wish to generate web pages from Excel macros. The following VBA code can create an HTML page header which includes some CSS formatting instructions and classes.


      print #1,"<head>"
print #1,"<meta content='en-gb' 
	  http-equiv='Content-Language' />"
print #1,"<meta content='text/html; 
	  charset=utf-8' http-equiv='Content-Type' />"
print #1,"<title>MeadInKent 
	  website</title>"
print #1,"<style type='text/css'>"

	  print #1,".stylegrey {background-color: #EAEAEA;}"
print 
	  #1,".stylegreen1 {background-color: #ECFFEC;}
.stylegreen2 
	  {background-color: #C7F1C7;}
.stylered1 {background-color: #FFF1EE;}

	  .stylered2 {background-color: #FFD3CA;}
body {font-family: Arial, 
	  Helvetica;font-size: 11pt; margin-left:40px; margin-right: 40px}
h1 
	  {color: green; font-size: 14pt; font-weight: bold; margin-top: 8px; 
	  margin-bottom: 4px}
td {padding: 3pt 5pt 4pt 5pt; border-style: solid; 
	  border:1px solid white;}
table {border-collapse: collapse; font-size: 
	  11pt; border: 2 solid white}
.MyFooter {font-size: 8pt; font-variant: 
	  small-caps; text-transform: uppercase; color: #0F5BB9; margin-top: -2px}"

	  print #1,"td.msblue {background-color: #3333ff;color: #ffffff;font-weight: 
	  bold;padding: 4px;}"
print #1,".styleborder {border-color: 
	  #000080;border-width: 2px;}"
print #1,"</style></head>"

The following items have had these CSS instructions applied.

Heading one

A default paragraph which is not defined in this particular set of CSS instructions.

The following table uses a CSS class to format the blue header cells: <class='msblue'> The table itself uses the default <table> instructions.

msblue	msblue
three	four

The following example uses various CSS classes to format some of the cells. <td class='msblue'> The table itself uses a class to add a border: <table class='styleborder'>.

none	none
stylered1	styleborder
stylered2	stylegreen1
stylegrey	stylegreen2

The following paragraph has been given a CSS attribute in order to reduce its size and change its colour and case.

A page footer using <p class='myfooter'>

A collection of free HTML, CSS, JavaScript, DHTML, XML, XHTML, WAP, ASP, SQL tutorials with lots of working examples and source code. I have found this to be the most useful site for learning about anything web-related.

file: helpusingcss.htm

Last updated Aug14