user3161620
user3161620

Reputation: 29

How do I give a header it's own stylesheet?

Specifaclly I just want to change this header by giving it's own, color, font, size, weight.etc

<div id="header">
   <a href="google.com">
   <h1>
       <li><a href="#" class="navLink">EXAMPLE LINK</a></li>
   </h1>
</div>

Upvotes: 2

Views: 703

Answers (2)

Josh Beam
Josh Beam

Reputation: 19802

Firstly, there are several errors in your HTML, which should be fixed first:

<div id="header">
    <!-- needs a closing </a> tag and some text, as well as a full href -->
    <a href="http://google.com"></a>
    <!-- what is your reason for using an LI element here? -->
    <h1><li><a href="#" class="navLink">EXAMPLE LINK</a></li></h1>
</div>

As far as styling, you can use CSS, like so:

h1 {
    color: red;
    font-size: 5em;
    text-decoration: underline;
}

/* etc. */

Search Google for basic CSS tutorials. Once you've decided which styles you would like to apply, simply save your text document as something like "style.css", and add a LINK element to the header of your HTML file (this will allow you to use it as an external stylesheet.):

<head>
    <link rel="stylesheet" href="style.css" />
</head>

There are other methods for applying styles, such as inline styling, etc., but the above is one of the more typical ways of going about doing it.

Here are some resources to get you started:
w3schools CSS tutorial
CSS-Tricks
How to apply stylesheets

Upvotes: 2

acarlon
acarlon

Reputation: 17272

Here is a jsfiddle

You specify a stylesheet with:

<link href="<path>/site.css" rel="stylesheet" type="text/css" />

where <path> is the path to the stylesheet and Site.css is the name of your stylesheet. This is normally in <head>.

You do this either with an inline style or a style section in your page or in a style file. I wasn't sure if you wanted to format the a as well. Also, I wasn't sure if you want to style the header div or h1. If you want to style h1, then replace #header with h1 in css.

Upvotes: 0

Related Questions