Style Sheet Basic

NCD Style Sheet Guide v6.0

Sponsor's ADs:

+ Style Declaration

{PROPERTY: VALUE }
{PROPERTY: VALUE ; PROPERTY: VALUE ; ... PROPERTY: VALUE }

ex.
	{font-family: Arial; Color:red}

+ Style Specification

To specify the Style Declaration to Tags:


+ Linking Style Sheet

Style Sheet File (#.css):

    SELECTOR1 {PROPERTY: VALUE }
    SELECTOR2 {PROPERTY: VALUE }
    ....
    SELECTORn {PROPERTY: VALUE }

ex.
	H1 {font-family: Arial; font-size: 40pt; Color:red}
	P  {font-size:12pt; line-height:20pt}

To specify the Style Sheet File from HTML:

    <LINK REL="stylesheet" TYPE="text/css" HREF="#.css">

ex.
	<HEAD>
	<LINK REL="stylesheet" TYPE="text/css" HREF="samp.css">
	</HEAD>
	<BODY>
	<H1>Today is fine.</H1>
	<P>
	Long before the advent of TV weather forecasters,
	people used tabletop glasses like a spherical flask
	to predict upcoming changes in weather.
	</P>
	</BODY>
View this Example Page


+ Embedding Style Sheet

<HEAD>
<STYLE TYPE="text/css">
SELECTOR1 {PROPERTY: VALUE }
SELECTOR2 {PROPERTY: VALUE }
....
SELECTORn {PROPERTY: VALUE }
</STYLE>
</HEAD>

ex.
	<HEAD>
	<STYLE TYPE="text/css">
	     H1 {font-family: Arial; font-size: 40pt; Color:red}
	     P  {font-size:12pt; line-height:20pt}
	</STYLE>
	</HEAD>
	<BODY>
	<H1>Today is fine.</H1>
	<P>
	Long before the advent of TV weather forecasters,
	people used tabletop glasses like a spherical flask
	to predict upcoming changes in weather.
	</P>
	</BODY>
View this Example Page


+ Inline Styles

<TAG STYLE="PROPERTY: VALUE"> ... </TAG>

ex.
	<BODY>
	<H1 STYLE="font-family: Arial; font-size: 40pt; Color:red">
	Today is fine.
	</H1>
	<P STYLE="font-size:12pt; line-height:20pt">
	Long before the advent of TV weather forecasters,
	people used tabletop glasses like a spherical flask
	to predict upcoming changes in weather.
	</P>
	</BODY>
View this Example Page


+ Import Style Sheet

@import url(#.css);

<HEAD>
<STYLE TYPE="text/css">
  @import url(samp.css);
</STYLE>
</HEAD>
<BODY>
<H1>Today is fine.</H1>
<P>
Long before the advent of TV weather forecasters,
people used tabletop glasses like a spherical flask
to predict upcoming changes in weather.
</P>
</BODY>
View this Example Page



Style Sheet Guide | HTML Design Guide
Basic | Selector | Cascading
Font | Text | List | Color & Background | Box | Table | Position & Format | Other|
Selector List | Property List


BACK TO NCD HOME
Network Communication Design - /
Copyright & Publishing 1994-2008 Network Communication Design