MUDAH DI COBA! Penggunaan Style CSS Dan Properti

Halooo!! balik lagi sama aku Raisa hari ini aku akan menjelaskan tentang css seperti Inline Style, Internal Style, External Style.

INLINE STYLE

Merupakan salah satu cara memasukan kode css secara langsung ke dalam HTML.

Inline ini terletak di tag <body>

Contoh coding dengan inline style

<html>

<head>

    <title>CONTOH INLINE</title>

    <body>

        <h2 style="background-color:ye ; color:rgb(97, 11, 184)">

        Contoh Penggunaan Inline style </h2>

    </body>

</head>

</html>

Dengan hasil seperti dibawah ini

INTERNAL STYLE

Internal Style digunakan untuk pemisahan File CSS dari tag HTML. internal terletak pada tag <Head> dengan menggunakan tag <Style>.

Contoh coding dengan internal Style

<html>

<head>

  <title>Contoh Internal</title>

  <style type="text/css">

    body{background-color: rgba(244, 244, 3, 0.616);}

    h1{

      font-family: 'Times New Roman';

      line-height: 2.75em;

      font-size: 16px;

      color: rgb(0, 255, 204);:

    }

    p {

      font-family: 'Times New Roman';

      color: rgba(255, 0, 119, 0.524);

    }

  </style>

</head>

<body>

   <h1>Your Page</h1>

<p>Pengunaan Internal Style</p>  

</body>

</html>

Dengan hasil seperti ini

EXTERNAL STYLE

External Style digunakan untuk menggankat file CSS ke dalam file terpisah.Untuk memanggilnya menggunakan script html yang disisipkan antara tag head.

MENGENAL CLASS DAN ID HTML

Perbedaan dari class dan id adalah class di panggil pada css atau javascript dengan menggunakan tanda titik "." , dan id di panggil pada css atau javascript dengan tanda pagar " # " ada kelebihan di sini untuk class , yaitu class dapat di berikan pada banyak element html dan dapat di panggil sekaligus , sedangkan id hanya dapat bekerja pada satu penandaan