How to use tags in classes with CSS

Question

0.00/5 (No votes)

See more:

Good Morning Sir,
I am having a problem on using a classes in CSS I have so far searched in the internet but I could not find the answer so I am asking here,

I have a class in my external CSS file like this

CSS

.class
{
    h1
    {
        color:green;
    }
}

I have correctly linked the CSS to my HTML5 file using a link tag

HTML

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

But when I use the heading (h1) tags the font has no color (green)

What I have tried:

I searched in the internet. I am self-learning this so I don't know what am I missing.

I have searched about 20 web pages none of them gave me this answer,

To make my-self clear, can we create many classes in one external css file and in each class can we create styles for different tags?

CSS

.class
{
    h1
    {
        color:green;
    }
}
.class1
{
    h1
    {
        color:blue;
    }
}

If I use class then green color heading will be displayed if I use class1 blue color heading should be displayed how can I do that?

Kindly help me with this sir!

Thank you for your time sir!

Posted 5-Sep-16 4:08am

VISWESWARAN1998

Updated 5-Sep-16 9:01am

Add a Solution

4 solutions

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

David_Wimbley · Accepted Answer · 2016-09-05T04:10:00

Solution 1

I think what you mean to do is the following:

CSS

h1.class
{
    color:green;
}

h1.class1
{
    color:blue;
}

Or you can simply do

CSS

.class
{
    color:green;
}

.class1
{
    color:blue;
}

Which does not limit your css here to just h1 elements.

Posted 5-Sep-16 4:10am

David_Wimbley

Updated 5-Sep-16 4:51am

v3

Comments

[no name] 5-Sep-16 10:19am

Thank you for your solution sir,
I tried calling h1 your 1st option like this,
<body>
<div class="class1">

Hello world

</div>
</body>
but the color isn't displaying could help me with this?

And in the second option, Is there any way to change the attributes for the different tags

[no name] 5-Sep-16 10:21am

I am sorry the hello world has become bigger It is h1 tag

Richard Deeming 5-Sep-16 10:22am

In the second option, you're missing the . before the CSS class names. :)

David_Wimbley 5-Sep-16 10:52am

My bad, that's what I get for copy/paste. Updated...thanks

Karthik_Mahalingam 6-Sep-16 1:19am

5

W∴ Balboos, *GHB* · Accepted Answer · 2016-09-05T04:55:00

Declaring a class in CSS is one thing - you then need to make your various elements users of the class. You can have many classes - how does an element know which class or classes to use unless you tell it? You need a good tutorial on how CSS classes are used.

Try this one (worked for me): CSS Tutorial[^]

Peter Leow · Accepted Answer · 2016-09-05T05:12:00

Solution 3

Start learning CSS properly from Beginner's Guide to HTML5 & CSS3 - Styling Your First Web Page[^] and you shall be fine.

Posted 5-Sep-16 5:12am

Peter Leow

Updated 5-Sep-16 5:15am

v2

NaibedyaKar · Accepted Answer · 2016-09-05T09:01:00

Solution 4

Simple use

CSS

h1
    {
        color:green;
    }

This is a very fundamental thing. I think you are new to this area. But you can be a designer master if you really put some more effort into it. Learn it from CSS Tutorial[^]. And I am sure you will do great. Good luck!!!

Posted 5-Sep-16 9:01am

NaibedyaKar

How to use tags in classes with CSS

4 solutions

Solution 1

Hello world

Solution 2

Solution 3

Solution 4

Add your solution here

Preview 0

How to use tags in classes with CSS

4 solutions

Solution 1

Hello world

Solution 2

Solution 3

Solution 4

Add your solution here

Preview 0

Existing Members

...or Join us