Preston159
Preston159

Reputation: 302

Is it possible to reset CSS within an HTML file?

If I link a cascading stylesheet in my code with:

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

and within my CSS file I have

a:link, a:visited {
    display: block;
    width: 120px;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #1947D1;
    text-align: center;
    padding: 4px;
    text-decoration: none;
    text-transform: uppercase;
}
a:hover, a:active {
    background-color:#0029A3;
}

it all works fine, until I have to have a link that is formatted differently. Is it possible to easily reset the style completely or for one element in the middle of an HTML file? Or must I manually reset each aspect? I have tried doing

<style></style>

and

<a style="" href="projects.html">Projects</a>

but neither reset the style. Is this not possible, or am I just missing something obvious?

Upvotes: 0

Views: 84

Answers (2)

Ali Zahr
Ali Zahr

Reputation: 64

Just add a class name to your CSS and to your tag, and this will work fine.

a.class_name:link, a.class_name:visited {
    display: block;
    width: 120px;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #1947D1;
    text-align: center;
    padding: 4px;
    text-decoration: none;
    text-transformation: uppercase;
}
a.class_name:hover, a.class_name:active {
    background-color:#0029A3;
}

<a class="class_name" href="projects.html">Projects</a>

Upvotes: 0

dippas
dippas

Reputation: 60543

if I understand correctly you are looking to style the A link to projects in a different way that the rest of the main A links. right?

if so here it is:

<a class="some-class" href="projects.html">Projects</a>

.some-class {
background-color:red /* whatever you want here. */
}

Upvotes: 2

Related Questions