» » » » » HTML Css

HTML Css

Sinau Online No Comments


CSS atau Cascading Style Sheets


  • CSS digunakan untuk memberikan berbagai macam style pada elemen HTML.
  • CSS bisa dideklarasikan dengan tiga cara :
    • Inline : Di deklarasikan ke dalam attribut elemen HTML.
    • Internal : Di deklarasikan menggunakan elemen <style> di dalam elemen <head>.
    • External : Di deklarasikan pada sebuah file terpisah. 

      Contoh CSS
      Pada paragraf ini terdapat inline CSS.
      Pada paragraf menggunakan font family 'cursive'.
      Pada paragraf menggunakan font family 'monospace'.
      Pada paragraf menggunakan font family 'sans-serif'.

      HTML Editori <p style="color:#FF33FF; text-decoration:underline; font-size:13px;">
      Pada paragraf ini terdapat inline CSS.
      </p>

      <p style="font-size:16px; font-family:cursive">
      Pada paragraf menggunakan font family 'cursive'.
      </p>

      <p style="font-size:19px; font-family:monospace">
      Pada paragraf menggunakan font family 'monospace'.
      </p>

      <p style="font-size:19px; color:#FF3333; font-family:sans-serif">
      Pada paragraf menggunakan font family 'sans-serif'.
      </p>

      Mengenai CSS


      CSS diperkenalkan bersamaan dengan HTML 4.0.

      Cara terbaik dari desain sebuah CSS adalah dengan menempatkan CSS pada file yang terpisah atau disebut dengan eksternal CSS.

    • Internal CSS

      • Internal CSS di deklarasikan di bagian elemen <head> pada suatu dokumen HTML.
      • Internal CSS akan mempengaruhi semua elemen dibawahnya yang sesuai dengan yang di deklarasikannya.
      misal :
      <style>
          p{color:green}
      </style>
      </head>
      Pada contoh di atas,p{color:green} akan mempengaruhi semua elemen <p>... </p> di dalam dokumen tersebut.

      Contoh internal CSS :

      HTML Editori
      <html>

      <head>

      <style>

      h2{color:#33FFFF; text-decoration:underline;}

      p{color:red; font-family:cursive; font-size:15px;}

      </style>

      </head>

      <body>

      <h2>Style heading ini dibuat dengan internal CSS. </h2>

      <p>Style paragraf ini dibuat dengan internal CSS. </p>

      </body>

      </html>

       

       

Dear readers, after reading the Content please ask for advice and to provide constructive feedback Please Write Relevant Comment with Polite Language.Your comments inspired me to continue blogging. Your opinion much more valuable to me. Thank you.

Subscribe to: Post Comments (Atom)