How to format specific links?

Asked

Viewed 55 times

-1

The way I learned, is that I apply the style to all links, I wanted to know how I could do it, here are two Divs I wanted to apply the styles only in the first div with the id="links1"

Html

<!DOCTYPE html>
<html>
<head>
    <title>Exemplo listas</title>
    <meta charset="utf-8">
    <style type="text/css">
        a{
            text-decoration: none;
        }

        a:link, a:visited{
            color: blue;
        }

        a:hover{
            color: white;
            background: yellow;
        }

    </style>
</head>
<body>
    <div id="links1">
        <a href="">Google</a>
        <a href="">You Tube</a>
        <a href="">Facebook</a>
    </div>
    <!---->
    <br>
    <div id="links2">
        <a href="">Google</a>
        <a href="">You Tube</a>
        <a href="">Facebook</a>
    </div>
</body>

html css

1 answer

1


You can apply the style to classes, tags or id’s. To apply to classes, simply add the class to your tag with the attribute class="nome_da_classe". That way, the CSS looks like this:

.nome_da_classe{
  atributo1: 10px;
  atributo2: 10px;
  ...
}

Similarly, you do with the id’s, but notice what I use # instead of . to indicate that I am applying a CSS to a specific ID and not a class. You define through the attribute id in tags and your CSS gets that way:

#id{
  atributo1: 10px;
  atributo2: 10px;
  ...
}

It’s important to understand that you use classes when you want to extend a certain style to multiple components and you don’t want to write a CSS for each of them. You use the style for an ID when you want a specific component with that CSS you encoded. And finally, tags get style in general when normally you won’t change them within classes and ids (example: every tag <p> must have a source Arial; that way, every tag p, as long as you don’t have your CSS overwritten, you’ll have this source).

  • 1

    I got it, I didn’t know you could do that, thank you

Browser other questions tagged html css

You are not signed in. Login or sign up in order to post.