CSS selectors


CSS selectors is used to select HTML elements which you want to syle.

 

Id selector

 

Syntax –

Id=” unique id name here

 

For example

<html>

<head>

          <title>Teknowize</title>

          <link rel="stylesheet" type="text/css" href="G:/style.css">

</head>

<body>

    <h2> welcome to teknowize</h2>

    <h2 id="kuchv"> thank you </h2>

    <p> this is my website </p>

 

</body>

</html>


#kuchv

{

    Color:  red;

}


Output

css selectors

Class selector

 

Syntax –

class=" unique class name here "

 

For example

<html>

<head>

          <title>Teknowize</title>

          <link rel="stylesheet" type="text/css" href="G:/style.css">

</head>

<body>

    <h2> welcome to teknowize</h2>

    <h2 class="kuchv1 kuchv2 "> thank you </h2>

    <p> this is my website </p>

 

</body>

</html>


.kuchv1

{

    Colorred;

}

.kuchv2

{

   font-size:1rem;

}


Output

css selectors


CSS Universal Selector


For example

<html>

<head>

          <title>Teknowize</title>

          <link rel="stylesheet" type="text/css" href="G:/style.css">

</head>

<body>

    <h2> welcome to teknowize</h2>

    <h2> thank you </h2>

    <p> this is my website </p>

 

</body>

</html>


 *

{

    Color:  red;

}


Output

css selectors

CSS element Selector


For example

<html>

<head>

          <title>Teknowize</title>

          <link rel="stylesheet" type="text/css" href="G:/style.css">

</head>

<body>

    <h2> welcome to teknowize</h2>

    <h2> thank you </h2>

    <p> this is my website </p>

 

</body>

</html>


 p

{

    Color:  red;

}


Output

css selectors