In your html / php file add this
<head>
<link rel="stylesheet" href="styles.css">
</head>(The old type=”text/css” is no longer required)
Create your styles.css file
An example with a good main stylesheet default content
@charset "utf-8";
/*------------------------------------------*/
/*----- REMOVE VARIED BROWSER DEFAULTS -----*/
/*------------------------------------------*/
/*Remove padding and margin from all elements as defaults can differ between browsers*/
* {
margin: 0;
padding: 0;
border: 0;
}
/*-----------------------------*/
/*----- MAIN PAGE WRAPPER -----*/
/*-----------------------------*/
body {
text-align:center;
}
#wrapper {
width:980px;
margin-left:auto;
margin-right:auto;
background-color: #FFFFFF;
text-align:left;
}
/*----------------*/
/*----- TEXT -----*/
/*----------------*/
html, body {
font-family: Arial, Helvetica, sans-serif;
color: #000000;
font-size: 16px; /*16px is the typical browser default text size*/
}
h1 {
font-size: 2.0em;
line-height: 1.4em;
margin: 0.67em 0 0.2em 0;
}
h2 {
font-size: 1.7em;
line-height: 1.5em;
margin: 0.75em 0 0.1em 0;
}
h3 {
font-size: 1.4em;
line-height: 1.3em;
margin: 0.83em 0 0.1em 0;
}
h4 {
font-size: 1.2em;
line-height: 1.1em;
margin: 1.12em 0 0.1em 0;
}
h5 {
font-size: 1.2em;
line-height: 1em;
margin: 1.5em 0 0em 0;
}
p {
font-size: 1.0em;
margin: 1.12em 0;
}
/*----- LINKS -----*/
a {
text-decoration:none;
color:inherit;
}
a:hover {
text-decoration:underline;
color:inherit;
}
/*-----------------*/
/*----- FORMS -----*/
/*-----------------*/
input.text {
padding: 3px;
border: 1px solid #999999;
}
Feel free to comment if you can add help to this page or point out issues and solutions you have found. I do not provide support on this site, if you need help with a problem head over to stack overflow.